vue+element+Cascader 级联选择器任意一级选项,去掉单选框radio
<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>
分类:
Element-ui框架
, Vue框架
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通