过滤

作者: Clover园 | 来源:发表于2019-03-29 03:43 被阅读0次
<template>
  <div id="we">
    <ul>
      <li v-for="i in labels" :key="i.labelNameId">
        <CheckboxGroup v-model="disabledGroup" @on-change="change">
          <Checkbox
            v-for="item in i.labelValves"
            :label="i.labelNameId + ':' + item.labelId"
            :key="item.labelId"
          >{{item.labelValue}}</Checkbox>
        </CheckboxGroup>
      </li>
    </ul>
  </div>
</template>
<script>
export default {
  data() {
    return {
      disabledGroup: [],
      selectLabels: [],
      selectLabelsInfo: [],
      labels: [
        {
          labelName: "配置一",
          labelNameId: 1,
          labelValves: [
            { labelId: 101, labelValue: "一一" },
            { labelId: 102, labelValue: "一二" }
          ]
        },
        {
          labelName: "配置二",
          labelNameId: 2,
          labelValves: [
            { labelId: 201, labelValue: "二一" },
            { labelId: 202, labelValue: "二二" }
          ]
        },
        {
          labelName: "配置三",
          labelNameId: 3,
          labelValves: [{ labelId: 301, labelValue: "三一" }]
        }
      ]
    };
  },
  methods: {
    change(data) {
      let obj = {};
      this.selectLabels = [];
      this.disabledGroup = data;
      data.map(label => {
        this.labels.forEach(i => {
          let valArr = [];
          if (label.split(":")[0] === i.labelNameId + "") {
            i.labelValves.forEach(l => {
              if (label.split(":")[1] === l.labelId + "") {
                valArr.push(l);
              }
            });
            obj = {
              labelName: i.labelName,
              labelNameId: i.labelNameId,
              labelValves: valArr
            };
            this.selectLabels.push(obj);
          }
        });
      });
      let temp = {};
     let  newArry = [];

      this.selectLabels.map(i => {
        var key = i.labelNameId;
        if (temp[key]) {
          let arr = temp[key].labelValves.concat(i.labelValves);
          temp[key].labelValves = arr;
          temp[key].labelNameId = i.labelNameId;
          temp[key].labelName = i.labelName;
        } else {
          temp[key] = {};
          temp[key].labelValves = i.labelValves;
          temp[key].labelNameId = i.labelNameId;
          temp[key].labelName = i.labelName;
        }
      });
      for (var k in temp) {
        newArry.push(temp[k]);
      }
      this.selectLabelsInfo = newArry.slice(0, newArry.length);
    }
  }
};
</script>

相关文章

  • 笔记一

    基本 层次 过滤 基本过滤 内容过滤 属性过滤 可见性

  • 追求

    过滤我的朋友圈, 过滤我的忧伤, 过滤我的懦弱, 过滤我的被伤害, 过滤我的失去, 过滤...

  • wireshark网络包常用过滤方法

    一,ip过滤 二,端口过滤 三,方法过滤 四,多条件过滤

  • 2019-03-01 过滤器

    1 web过滤器是什么? 过滤源 → 过滤规则 → 过滤结果过滤器不处理请求 2 过滤器的概念 3 过滤器的工...

  • 滤材袋网袋,水族箱过滤材料袋 过滤袋,液体过滤袋

    涂装脱脂过滤袋 油漆油墨_涂料过滤用液体过滤袋滤材袋网袋,水族箱过滤材料袋 过滤袋,液体过滤袋 鱼缸鱼池海鲜池过滤...

  • Vue过滤器-filter

    过滤器,过滤东西呗.把一个值丢进过滤器,然后过滤器对此值进行过滤.返回过滤后的数据. Vue过滤器分全局过滤器和组...

  • 对HBase进行过滤

    包括表过滤、列标签过滤、值过滤

  • filter知识

    输入和输出都过滤,urlPattern可以配置过滤哪些servlet;路径过滤/和文件名称过滤.jsp; 过滤器链...

  • grep sed参数整理

    1.grep 过滤sed 增删改查 过滤 替换 修改 取行awk 过滤 取列 统计计算grep 过滤-i 过滤不...

  • 2018-08-23

    Java Web开发技术应用——过滤器 什么是过滤器:过滤源 ——> 过滤规则 ——> ...

网友评论

      本文标题:过滤

      本文链接:https://www.haomeiwen.com/subject/eoqkbqtx.html