c-treeSelect 下拉树多选

<template>
  <CTreeSelect :data="data" />
</template>

<script>
  export default {
    data() {
      return {
        // defaultProps: {
        //   children: 'children',
        //   label: 'label',
        // },
        values: "",
        // treeData: [],
        data: [
          {
            id: "1",
            name: "一级 1",
            children: [
              {
                id: "2",
                name: "二级 1-1",
                children: [
                  {
                    id: "3",
                    name: "三级 1-1-1",
                  },
                ],
              },
            ],
          },
          {
            id: "4",
            name: "一级 2",
            children: [
              {
                id: "5",
                name: "二级 2-1",
                children: [
                  {
                    id: "6",
                    name: "三级 2-1-1",
                  },
                ],
              },
              {
                id: "7",
                name: "二级 2-2",
                children: [
                  {
                    id: "8",
                    name: "三级 2-2-1",
                  },
                ],
              },
            ],
          },
        ],
      };
    },
    methods: {
      getNode(data) {
        console.log(data);
      },
    },
  };
</script>

Expand Copy Copy

属性

属性名	类型	说明	补充说明
name	string/number	当传入该属性时会出现回显字段（name 如果为 id 值会自动匹配对应字段回显，如果传入文字类型也会回显文字不过树形下拉框中无法高亮选中对应字段）	-
data	Array	树状数据格式(具体可参见 elementui 的树形结构)	-
defaultProps	Object	详见 elemenui 中 tree 组件 prop 属性说明	该属性会有一个默认值{ value: "id", label: "name", children: "children" }，一般这个属性是配合后端返回的字段来使用