vue中使用elementui级联组件常见的数据处理问题

最近项目中遇到一个问题,使用elementui级联组件与后台联调是返回的数据里面没有label和value,这时页面不会显示,在不改变原生组件的情况下,我们可以利用递归对数据进项处理,每个里面都加上label和value。

methods(){
findChildren(node) {
      node.forEach((ele, index) => {
        const children = ele.children;
        ele.value = ele.code;
        ele.label = ele.name;
        if (children) {
          this.findChildren(children);
        }
      });
    }
}

在相应的地方调用此方法,把要处理的数据传进去,例如我的业务是在调用接口后请求的时候对数据进行处理

      postDictoryData1(param).then(data => {
        console.log("栏目获取词条", data);
        this.findChildren(data.entityList);
        this.wordEntryList = data.entityList;
        console.log("citiooo", this.wordEntryList)
      });

 

你可能感兴趣的:(FQ,vue)