日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學無先后,達者為師

網(wǎng)站首頁 編程語言 正文

element樹組件父子關(guān)聯(lián)

作者:大橙子額 更新時間: 2022-03-03 編程語言

el-tree組件父子關(guān)聯(lián)問題

el-tree選了父節(jié)點后,子節(jié)點均會選中,子節(jié)點都取消之后,父節(jié)點也取消,導致不選擇子節(jié)點就無法選擇父節(jié)點
解決:取消父子關(guān)聯(lián)關(guān)系
element配置

:check-strictly="true"

這樣父、子節(jié)點完全不關(guān)聯(lián),勾選毫無關(guān)系。
但是業(yè)務(wù)需求是,要勾選子節(jié)點必須先勾選父節(jié)點
于是寫了@check方法,在勾選子節(jié)點時,自動勾選父節(jié)點

<el-tree
  :data="menuOptions"
  show-checkbox
  ref="menu"
  node-key="id"
  :check-strictly="true"
  @check="getCurrentNode"
  empty-text="加載中,請稍后"
  :props="defaultProps"
  :default-checked-keys="defaultCheckedKeys"
></el-tree>
getCurrentNode(data) {
  const node = this.$refs.menu.getNode(data);
  this.childNodes(node);
  this.parentNodes(node);
},
childNodes(node) {
  const len = node.childNodes.length;
  for (let i = 0; i < len; i += 1) {
    node.childNodes[i].checked = node.checked;
    this.childNodes(node.childNodes[i]);
  }
},
parentNodes(node) {
 if (node.parent) {
    for (const key in node) {
      if (key === 'parent') {
        node[key].checked = true;
        this.parentNodes(node[key]);
      }
    }
  }
},

原文鏈接:https://blog.csdn.net/weixin_43043994/article/details/110976934

欄目分類
最近更新