elelemt ui tree组件单选-我爱编程

当前位置：: 首页; 文章; 前端
详情

elelemt ui tree组件单选

前端
三生万物
0

<el-form-item label="分类">
  <el-tree
    :data="list"
    show-checkbox
    default-expand-all
    node-key="id"
    ref="tree"
    highlight-current
    check-strictly
    :props="defaultProps"
    @check-change="handleNodeClick">
  </el-tree>
</el-form-item>

<script>
export default {
  data() {
    return {
      list: [],
      dialog: {
        form: {
          pid: ''
        }
      },
      defaultProps: {
        children: 'children',
        label: 'name'
      }
    }
  },
  methods: {
    // 处理节点选择
    handleNodeClick(item, checked, node) {
      if(checked === true) {
        this.dialog.form.pid = item.id;
        this.$refs.tree.setCheckedKeys([item.id]);
      } else {
        if(this.dialog.form.pid == item.id) {
          this.$refs.tree.setCheckedKeys([item.id]);
        }
      }
    },
  }
}
</script>

免责申明：本站发布的内容（图片、视频和文字）以转载和分享为主，文章观点不代表本站立场，如涉及侵权请联系站长邮箱：xbc-online@qq.com进行反馈，一经查实，将立刻删除涉嫌侵权内容。