JS+Vue实现三级全选单选_javascript技巧_

需求分类
全选 
{{ itns.name }} 
{{ cd.name }}

data () {     classiFications: [], //需求分类 接口给的集合     demandChecked: false, // 需求分类全选     ficationsCheck: [], //一级分类的单个全选     childrenCheck: [], //二级分类的全选     demandCheckedShow: false, //二级全选不触发接口 }   methods: {     // 需求分类全选     handledemandChecked() {                  if (this.demandChecked) {             this.classiFications.forEach((it, is) => {             this.ficationsCheck[is] = true;             this.handleFicationsCheck(is);             });         } else {             this.classiFications.forEach((it, is) => {             this.ficationsCheck[is] = false;             this.handleFicationsCheck(is);             });         }         },         //一级分类所选         async handleFicationsCheck(id) {                  this.demandCheckedShow = true;         let tmp = this.classiFications[id].childrenIds; //当前选择的id子集合         let tmpAdd = this.childrenCheck; //当前选择的id子集合         if (this.ficationsCheck[id]) {             tmp.forEach((item) => {             for (let i = 0; i < tmp.length; i++) {                 if (tmpAdd.indexOf(item) === -1) {                 this.childrenCheck.push(item);                 }             }             });         } else {             tmp.forEach((item) => {             for (let i = 0; i < tmp.length; i++) {                 if (tmpAdd.indexOf(item) !== -1) {                 this.childrenCheck.splice(this.childrenCheck.indexOf(item), 1);                 }             }             });         }         // this.handleType();         this.currentPage = 0;         await this.initSolutionAllPage();         this.demandCheckedShow = false;         },         //二级分类所选         handlechildrenCheck(ids, cd) {                console.log(cd);         let cont = 0;         // let conts = 0;         let tmp = this.classiFications[ids].childrenIds; //当前选择的id子集合         let tmpAdd = this.childrenCheck; //当前选择的id子集合         if (this.ficationsCheck[ids]) {             tmp.forEach((item) => {             for (let i = 0; i < tmp.length; i++) {                 if (tmpAdd.indexOf(item) === -1) {                 this.ficationsCheck[ids] = false;                 }             }             });         } else {             let tmpl = tmp.length === 1 ? 1 : tmp.length - 1;             tmp.forEach((item) => {             for (let i = 0; i < tmpl; i++) {                 if (tmpAdd.indexOf(item) !== -1) {                 // console.log(item);                 cont = cont + 1;                 }             }             });             if (cont === this.classiFications[ids].childrenIds.length) {             this.ficationsCheck[ids] = true;             }         }         // this.handleType();         if (!this.demandCheckedShow) {             this.currentPage = 0;             this.initSolutionAllPage();         }     }, }