设置el-cascader级联组件父子不关联，解决只能点击单选框才能选中，点击label无反应

最新推荐文章于 2024-06-19 20:53:45 发布

皮卡丘-杰尼龟

最新推荐文章于 2024-06-19 20:53:45 发布

阅读量468

点赞数 1

文章标签： vue.js elementui javascript

本文链接：https://blog.csdn.net/weixin_46328739/article/details/136070550

版权

设置el-cascader级联组件父子不关联，解决只能点击单选框才能选中，点击label无反应

解决方案
- 关键是style中的样式

<template>
<el-cascader
      size="large"
      :props="props"
      :options="cascaderOption"
      v-model="selectedOptions"
      ref="place"
    >
    </el-cascader>
</template>
<script>
export default {
  data () {
    return {
      props: {
        value: 'id',
        label: 'name',
        checkStrictly: true
      },
      selectedOptions: [],
      cascaderOption: [],
      originData: [],
      cascaderList: []
    }
  },
  watch: {
    
  },
  mounted () {
  },
  beforeDestroy () {},
  methods: {}
    
}
</script>
<style lang="scss">
.el-cascader-panel .el-radio {
  width: 100%;
  height: 100%;
  z-index: 10;
  position: absolute;
  left: 0;
}

.el-cascader-panel .el-radio__input {
  visibility: hidden !important;
}
</style>