更新记录

1.0.2（2024-06-13） 下载此版本

修复子项无法滚动的问题

修复最后一项children为空数组时还会继续显示tab的问题

1.0.1（2024-06-12） 下载此版本

更新了回显，通过双向绑定的方式进行回显

1.0.0（2024-06-12） 下载此版本

首次发布

平台兼容性

props

events

基本使用

确保项目已经安装 scss

将树型数组传递给 list 属性，通过 ref 的方式调用 open 方法打开组件

通过 v-model 对选中的数据进行双向绑定

<template>
  <div class="mt-200rpx" @click="open">
    打开
  </div>
  <div>选择的值：{{ test1 }}</div>
  <wCascader v-model="test1" title="请选择" @finish="finish" :list="list" ref="cascaRef" />
</template>

<script setup>
import wCascader from '@/components/w-cascader/w-cascader.vue'

const cascaRef = ref(null)
const test1 = ref('')
const open = () => {
  cascaRef.value.open()
}

const finish = (e) => {
  console.log(e)
}

const list = [
  {
    value: '1',
    label: 'Level1',
    children: [
      {
        value: '1-1',
        label: 'Level1-1',
        children: [
          {
            value: '1-1-1',
            label: 'Level1-1-1'
          }
        ]
      },
      {
        value: '1-2',
        label: 'Level1-2'
      },
      {
        value: '1-3',
        label: 'Level1-3'
      }
    ]
  },
  {
    value: '2',
    label: 'Level2',
    children: [
      {
        value: '2-1',
        label: 'Level2-1',
        children: [
          {
            value: '2-1-1',
            label: 'Level2-1-1'
          }
        ]
      },
      {
        value: '2-2',
        label: 'Level2-2',
        children: [
          {
            value: '2-2-1',
            label: 'Level2-2-1',
            children: [
              {
                value: '2-1-1-1',
                label: 'Level2-1-1',
                children: [
                  {
                    value: '2-1-1-1-1',
                    label: 'Level2-1-1-1-1',
                    children: [
                      {
                        value: '2-1-1-1-1-1',
                        label: 'Level2-1-1-1-1-1'
                      }
                    ]
                  }
                ]
              }
            ]
          }
        ]
      }
    ]
  }
]

</script>

popup props

通过 popupProps 传入

tab props

通过 tabProps 传入