element中el-cascader通过props自定义设置value、label、children

当我们使用el-cascader组件时,有时后台返回的数据和我们组件对应的值不一样,很多人会选择把后台返回的值给循环遍历处理一遍,把值改成value、label、children,但是实际不必如果。通过props属性轻松配置,话不多说,直接上代码:

后台返回的数据:

[{
 id: '1',
 name: '指南',
 child: [{
      id: 'shejiyuanze',
      name: '设计原则',
      child: [{
        id: 'yizhi',
        name: '一致'
       }]
 }]

vue文件

<el-cascader
    :options="cityList"
    :props="{ value: 'id',label: 'name',children: 'child'}"
    v-model="selectedOptions"
    @change="handleChange">
</el-cascader>

ok,是不是超级简单。如果看不懂的宝宝,你要细品。

版权声明:除特别注明外,本站所有文章均为田珊珊个人博客原创

转载请注明:出处来自田珊珊个人博客 » element中el-cascader通过props自定义设置value、label、children

点赞

发表评论

邮箱地址不会被公开。 必填项已用*标注

  1. 周易测算网说道:

    谢谢分享,日常打卡~ 滴滴~