Vue_shop学习94：商品分类页面数据父级分类的级联选择框单选

最新推荐文章于 2024-05-02 21:17:26 发布

¡Venceremo

最新推荐文章于 2024-05-02 21:17:26 发布

阅读量302

点赞数

分类专栏： Vue_shop 文章标签：学习

本文链接：https://blog.csdn.net/weixin_47295886/article/details/130501260

版权

Vue_shop 专栏收录该内容

93 篇文章 3 订阅

订阅专栏

级联优化：

clearable：可清除

但是目前只能选择第三级别，无法选择前面的一级分类选择任意一个级别

props.checkStrictly = true 来设置父子节点取消选中关联，从而达到选择任意一级选项的目的

   <el-form-item label="父级分类：">
                    <!-- expandTrigger控制方式 :options数据源 :props指定配置对象 
                        v-model双向绑定道数据中 @change选择项发生变化触发函数
                       clearable支持清空
                    -->
                        <el-cascader
                        v-model="selectedKeys"
                        :options="parentCateList"
                        :props="cascaderProps"
                        @change="parentCateChanged"
                        clearable
                       
                       >
                      </el-cascader>
                </el-form-item>

checkStrictly:true,

    cascaderProps:{//指定级联选择器的配置对象 映射数据
                    expandTrigger: 'hover' ,
                    value:'cat_id',//指定选项的值为选项对象的某个属性值
                    label:'cat_name',//指定选项的值为选项对象的某个属性值
                    children:'children',//指定选项的子选项为选项对象的某个属性值
                    checkStrictly:true,//父子节点取消选中关联，从而达到选择任意一级选项的目的
                },