<template> <div class="block"> <h1 class="demonstration">选中的值:{{ value }}</h1> <el-cascader :options="options" v-model="value" popper-class="cascaderBox" :props="defaultProps" clearable ></el-cascader> </div> </template> <script> export default { data() { return { value: "10", defaultProps: { emitPath: false, checkStrictly: true, value: "id", label: "name", children: "children", }, options: [ { id: "1", name: "分类1", children: [ { id: "10", name: "列表1", }, { id: "11", name: "列表2", }, ], }, { id: "20", name: "分类2", children: [ { id: "21", name: "列表1", }, { id: "22", name: "列表2", }, ], }, ], }; }, methods: { visibleChange() { if (this.$refs["cascader"]) { this.$refs["cascader"].closeVisible = false; } }, }, }; </script> <style lang="less"> .el-cascader-panel .el-radio { width: 100%; height: 100%; z-index: 10; position: absolute; top: 10px; right: 10px; } .el-cascader-panel .el-radio__input { visibility: hidden; } .el-cascader-panel .el-cascader-node__postfix { top: 10px; } </style>
标签:el,name,单选框,children,element,radio,选择器,cascader,id From: https://www.cnblogs.com/CinderellaStory/p/18469793