zoukankan      html  css  js  c++  java
  • Vue ElementUI Tree组件 回显问题(设置选择父级时会全选所有的子级,有此业务场景是不适合的)

    业务场景下有这样的问题

    业务需求需要保存前端 半选节点

    解决方案

    let checked = this.$refs.menuTree.getCheckedKeys();
    //此方法获取半选节点
    let halfChecked = this.$refs.menuTree.getHalfCheckedKeys();
    //我们合并两个数组,便获取到了我们选中的节点及半选节点
    let cArr=checked.concat(halfChecked);
    

    之后业务数据包含半选的节点,在前端回显时会全选他的子节点,???!!非我们预期

    其中一种解决方法,去除业务数据中的父节点信息

    let resData=[]//获取后端数据(包含半选节点,数据结构为 数组...[{id:XX,pid:XXX},...])
    let checked = [];//需要选中的节点
    let pidArr=[];//获取父节点
    for (let item of resData) {
        pidArr.push(item.pid);
    }
    
    for (let item of resData) {
        let id=item.id;
        let isP=pidArr.includes(id);
        if(!isP){
            checked.push(id);
        }
    }
    
    this.$nextTick(function () {
        that.$refs.menuTree.setCheckedKeys([]);
        that.$refs.menuTree.setCheckedKeys(checked);
    });
    
  • 相关阅读:
    Mybatis连接配置文件详解
    MyBatis映射配置文件详解
    AGC 016 C
    CodeForces
    UVA
    某5道CF水题
    DZY Loves Chinese / DZY Loves Chinese II
    [SHOI2016] 黑暗前的幻想乡
    CodeForces
    CodeForces
  • 原文地址:https://www.cnblogs.com/dadiwm321/p/elemelt_ui_tree.html
Copyright © 2011-2022 走看看