hehehai/vue-overflow-list

refactor:simplify code, merge collapse and orverflow list

hehehai opened this issue · 1 comments

  1. 重构代码,简化处理功能,去除不必要的逻辑
  2. 合并两个组件,用 mode prop 来判断是那种使用方式
<OverflowList :items="[1, 2, 3, 4]">
    <template #overflow="{count}">
      <div>{{count}}</div>
    </template>
    <template #visible="{item, count}">
      <div>{{item}} {{count}}</div>
    </template>
</OverflowList>

为了使用方便,这里必须要传入 items,visible slot 仅提供展示单项的渲染,而 slot overflow 有 count

这里的问题是 visible slot 的 ref 获取,而且 visible slot 的内容可能仅是文本,没有 ref

visible slot child 类型

  • dom: 使用 visible slot({item, count}) 渲染全部元素
  • text:首节点类型若为文本,就需要设置一个渲染dom节点(默认为 div)渲染全部元素