基于vue手写tree插件的那点事儿(2)

//接收到数据在外面套一层 if(this.model[this.treekey]==undefined){ this.treekey=this.vistreekey; } if(this.model[this.treename]==undefined){ this.treename=this.vistreename; } if (this.model.disabled == true) { this.model.disabled = 'disabled'; } console.log('组件注册了吗'); if ((','+this.ids+',').indexOf(','+this.model[this.treekey]+',') == -1) { this.checkStatus = false; this.model.checkStatus=this.checkStatus; } else { this.checkStatus=true; this.model.checkStatus=this.checkStatus; this.treekeys[this.model[this.treekey]]= this.checkStatus; this.treenames[this.model[this.treename]]= this.checkStatus; this.opt.key=this.treekeys; this.opt['name']=this.treenames; } if(this.ids!=''){ var idarr = this.ids; for(var index in idarr){ this.treekeys[idarr[index]]=true; } if (this.names.indexOf(",") == -1&&this.names!='') { this.treenames[this.names]=true; }else{ var namearr = this.names.split(","); for(var index in namearr){ this.treenames[namearr[index]]=true; } } }

渲染默认数据

var newOpt ={'key':{},'name':{}}; newOpt.key = Object.assign(this.opt.key, opt.key); newOpt.name = Object.assign(this.opt.name, opt.name); var flag=false; for(var index in this.model[this.treechildren]){ if(newOpt.key[this.model[this.treechildren][index][this.treekey]]!=true){ flag=true; } } if(!flag){ newOpt.key[this.model[this.treekey]]=true; newOpt.name[this.model[this.treename]]=true; this.checkStatus=true; this.model.checkStatus=true; } for(var key in newOpt){ this.filterRealCheck(newOpt[key]); } this.opt=newOpt; this.$emit('keyname', newOpt);

选择节点数据处理

if(selected instanceof MouseEvent){ this.checkStatus=!this.checkStatus; }else{ this.checkStatus=selected; } this.model.checkStatus=this.checkStatus; if (this.model.expected != true) { this.treekeys[this.model[this.treekey]]= this.checkStatus; this.treenames[this.model[this.treename]]= this.checkStatus; this.opt.key=this.treekeys; this.opt['name']=this.treenames; } for(var index in this.$refs.child){ this.$refs.child[index].selectedObj(this.checkStatus); } this.$emit('keyname', this.opt);

手写控件总结

因为笔者是侧重后端,所以前端知识不是很好,这个组件写的也是很乱。这个组件是之前临时写的。里面没有进行系统的梳理,上述的逻辑也是很乱。读者需要的可以选择下列加入战队(#addMe)联系我

好了,以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对脚本之家的支持。

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/b6cd51392e3cd028c46d19a046ef7d72.html