基于 vue 末级品类弹窗选择组件

调用例子:

<CategoryDialog :paramPersonList="list"></CategoryDialog>

<script>
  import CategoryDialog from 'CategoryDialog'

  export default {
    components: {
      CategoryDialog
    },
    data() {
      return {
        list: [
          {
            id: 1,
            label: '产品',
            children: [
              { label: 'ASIN', value: 'CON-01', id: 11 },
              { label: 'Seller SKU', value: 'CON-02', id: 12 },
              { label: '品类', value: 'CON-03', id: 13 },
              { label: 'Listing标题', value: 'CON-04', id: 14 },
              { label: 'Review评分', value: 'CON-05', id: 15 }
            ]
          },
          {
            label: '订单',
            id: 2,
            children: [
              { label: '订单商品金额', value: 'CON-06', id: 21 },
              { label: '订单总金额（含运费）', value: 'CON-07', id: 22 },
              { label: '订购商品数量', value: 'CON-08', id: 23 },
              { label: '下单时间', value: 'CON-09', id: 24 },
              { label: '付款时间', value: 'CON-10', id: 25 },
              { label: '发货时间', value: 'CON-11', id: 26 }
            ]
          },
          {
            label: '客户',
            id: 3,
            children: [
              { label: '复购次数', value: 'CON-20', id: 31 },
              { label: '是否复购', value: 'CON-21', id: 32 },
              { label: '买家邮箱', value: 'CON-22', id: 33 },
              { label: '买家来件主题', value: 'CON-23', id: 34 },
              { label: '买家来件正文', value: 'CON-24', id: 35 }
            ]
          }
        ]
      }
    }
  }
</script>

使用方法： 点击选择品类，弹出树结构数据选择添加至页面展示