功能如下展示:
在公共的地方写好被引用的树
<template>
<el-select
ref="selector"
:value="valueTitle"
:clearable="clearable"
@clear="clearHandle"
>
<el-input
v-model="filterText"
class="selectInput"
:placeholder="placeholder"
/>
<el-option
:value="valueTitle"
:label="valueTitle"
class="options"
>
<el-tree
id="tree-option"
ref="selectTree"
:accordion="accordion"
:data="options"
:props="props"
:node-key="props.value"
:default-expanded-keys="defaultExpandedKey"
:filter-node-method="filterNode"
@node-click="handleNodeClick"
/>
</el-option>
</el-select>
</template>
<script>
export default {
name: 'ElTreeSelect',
props: {
/* 配置项 */
props: {
type: Object,
default: () => {
return {
value: 'id', // ID字段名
label: 'title', // 显示名称
children: 'children', // 子级字段名
};
},
},
/* 选项列表数据(树形结构的对象数组) */
options: {
type: Array,
default: () => {
return []; },
},
/* 初始值 */
// type: Number,
value: {
type: String,
default: () => {
retu