zoukankan      html  css  js  c++  java
  • elementUI多选框问题( 编辑中选中问题 )

    elementUI多选框问题( 编辑中选中问题 )

    <!--这里是权限的展示    两次for循环-->
    <div v-for="(itemParent, indexParent) in parentChildMap" :key="indexParent">
       <el-form-item class="xxx" :label="itemParent.name + ':'">
           <span v-for="(itemChild, indexChild) in itemParent.children" :key="indexChild" @change="handel(itemChild.id,itemChild.name,itemParent.id,itemChild.parentId)">
               <el-checkbox :label="itemChild.name" :checked="itemChild.checkedFlag"></el-checkbox>
           </span>
       </el-form-item>
    </div>        
    // 获取角色权限列表 复选框的数据   GET请求    复选框选中问题解决(所有数据在当前角色权限数据中调用)
        getListRoleList() {
          // 获取 当前 编辑角色的权限数据
          const req = {
            roleId: parseInt(this.$route.query.id)
          };
          roleList(req).then(({ data }) => {
            // 定义接收当前角色的数据
            let currentRolePermissionData = data.data;
            roleManagementPermissionlist().then(({ data }) => {
              this.roleBaseedVal = data.data;
              //使用过滤器先将父集合 和子集合分离出来
              this.roleBaseedVal.filter(item => {
                if (item.menuType == 1) {
                  this.parentVal.push(item);
                } else if (item.menuType == 2) {
                  this.childBtnVal.push(item);
                }
              });
              //根据parentId和id的相等关系,找出子对应父
              this.parentVal.filter(item => {
                //定义一个空数组,判断关系后重新赋值
                item.children = [];
                this.childBtnVal.filter(items => {
                  // 遍历当前角色数据 并定义选中与不选中( 在所有的按钮中加一个控制显示隐藏的属性 )
                  items.checkedFlag = false;
                  for (let i = 0; i < currentRolePermissionData.length; i++) {
                    // 判断所有的按钮数据中是否与当前角色id值为一样,如果有值为true选中
                    if (items.id == currentRolePermissionData[i].id) {
                      // 值为true时阻止本次循环
                      items.checkedFlag = true;
                      break;
                    }
                  }
                  if (item.id == items.parentId) {
                    item.children.push(items);
                  }
                });
              });
              //赋值给一个空数组,可以for循环了
              this.parentChildMap = this.parentVal;
            });
          });
        }
    //此方法直接执行
  • 相关阅读:
    wamp配置虚拟主机
    php单例模式
    YII缓存操作
    YII的延迟加载
    之字形打印二叉树
    对称的二叉树
    二叉树的下一节点
    删除链表的重复节点
    链表中环的入口
    字符流中第一个不重复的字符
  • 原文地址:https://www.cnblogs.com/home-/p/11895827.html
Copyright © 2011-2022 走看看