fix(useEllipsis): opt algo

packages/core/useEllipsis/index.ts

@@ -1,5 +1,4 @@
-import { ref, watch, watchEffect, type Ref } from 'vue'
-import { useWindowSize } from '@vueuse/core'
+import { ref, watchEffect, type Ref } from 'vue'
 
 interface UseEllipsisOptions {
   rows?: number // 同组件 prop default: 1
@@ -15,53 +14,46 @@ interface UseEllipsisReturn {
 
 function test() {
   const source =
-    '擁有正確的座右銘，可以幫助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！'
+    '擁擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！擁有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！有正確的座lwjeflwejf右銘，可以幫10230123助你改變心態，自信迎接新的一天，比前一天更好。座右銘能改變你的生活。將勵志名言納入內容，作為文案，用這些金句激勵讀者。讓名言成為你的引領，展翅高飛！'
   const lineHeight = 16
 
   const div = document.createElement('div')
   // const width = div.style.setProperty('width', `${width}px`)
   div.style.setProperty('line-height', `${lineHeight}px`)
   document.body.appendChild(div)
 
+  let i = 0
   // eslint-disable-next-line @typescript-eslint/no-shadow
   /**
    * 有一个空间，和一个字符串，请问最多能放多少个字符
    * @param content
    */
   function calc(content: string, res = '', tail = '') {
-    if (content.length === 0) return
-    let half = ''
-    let remain = ''
-    if (content.length > 1) {
-      half = content.slice(0, content.length / 2)
-      remain = content.slice(half.length)
-
-      div.innerText = `${res}${half}`
-      if (div.clientHeight > lineHeight) {
-        // 此时说明half无法放入
-        div.innerText = `${res}`
-        calc(half, res, tail + remain)
-      } else {
-        // 此时说明half可以被正确放入
-        // TODO: 需要考虑下上一次的remain
-        calc(remain + tail, res + half, '')
-      }
-    } else {
-      half = content
-
-      div.innerText = `${res}${half}`
+    i++
+    console.log(res, '|', content, '|', tail, '|', i)
+    if (content.length === 0) return res
+    if (content.length === 1) {
+      div.innerText = `${res}${content}`
       if (div.clientHeight > lineHeight) {
-        div.innerText = `${res}`
+        div.innerText = res
+        return res
       }
+      return `${res}${content}`
     }
-    // TODO: 如果 content 只有一个字符，
 
-    // 如果一半的字符串能放进去，那么剩余的就是content / 2
-    // 如果一半的字符串不能放进去，那么下次取值应该是 content / 2 / 2
-    // 但是一半的一半能放进去，那么下次的取值应该是从剩余的部分继续取值
+    const half = content.slice(0, content.length / 2)
+    const remain = content.slice(half.length)
+
+    div.innerText = `${res}${half}`
+    if (div.clientHeight > lineHeight) {
+      div.innerText = res
+      return calc(half, res, tail ?? remain)
+    }
+    return calc(remain + tail, res + half, '')
   }
 
-  calc(source)
+  const res = calc(source)
+  console.log(res)
 }
 test()
 const fontSize = ref<number>(1)