Element-plus 的Cascader 级联选择器 如何自定义Props
1、在el-cascader中设置props;2、设置customProps值;旨在分享~~~~~~~~~~4、最后实现效果可使用。
·
在做项目的时候可能存在不一定按照Element-plus的键名:value、label、children等等设置;所以方法如下~
1、在el-cascader中设置props;如下代码
<el-cascader
class="m-r-15"
v-model="type"
:props="customProps"
:options="options"
@change="handleChange"
/>
2、设置customProps值; 如下代码
customProps: {
multiple: false, // 启用多选
emitPath: false, // 只返回该节点的值
value: "id", // 自定义当前数组的键名 - value
label: "name", // 自定义当前数组的键名 - label
children: "children", // 自定义当前数组的键名 - children
expandTrigger: "click", // 次级菜单的展开方式 - click/hover
lazy: "true", // 是否动态加载子节点,需与 lazyLoad 方法结合使用
lazyLoad: "true", // 加载动态数据的方法,仅在 lazy 为 true 时有效
},
3、数据结构;如下代码
options: [
{
id: "高考模拟",
name: "高考模拟",
children: [
{
id: "word test",
name: "word test",
},
{
id: "file test",
name: "file test",
},
],
},
],
4、最后实现效果可使用。
旨在分享~~~~~~~~~~
更多推荐
已为社区贡献5条内容
所有评论(0)