vue2/3+element - 将级联选择器el-cascader修改为“点击文字就能选中“效果，单选/多选模式下点击label整行都可以直接选中，复选框多选模式下解决只能点击图标才能选中的问题

效果图

在vue2、vue3项目开发中，使用element组件库的Cascader级联选择器，修改为 “点击名字选中，并且自动关闭下拉框” 交互效果，原来无论是单选还是多选都必须点击label文字前方的圆圈或方块复选框，才能进行选中，这种交互很难使用都希望可以直接点击 “整行” 任意位置进行选中，勾选下级时自动计算并勾选上级(联动)，本方案修改支持单选、多选框，支持后端动态数据及懒加载多级嵌套数据。

提供详细示例代码，新手小白复制稍微改改就能用了。

效果图代码

全部代码如下。