el-cascader 动态加载+默认值

刚解决了这个问题，趁热赶快拿出来凉凉，明天早上起来估计会忘
下拉框的选择和默认值对于我来说一直都是个让人头疼的事，倒不是有多么难，而是很繁琐。
要保证有值，还要有显示的文字。表单提交后，再回过头编辑还要显示出来选择的项。
进入正题吧，我看别人写的文章也非常讨厌巴拉巴拉一堆没用的。
首先el-cascader最常用的是显示省市区，所有省市区三四千项一下子加载出来总会有个卡顿的过程，所以我一般用动态加载，这个element的文档和例子很清楚了。
这是我代码中的一部分，尽可能的去掉了多余的代码

<el-cascaderref="areas"v-model="address.area_ids":options="options":props="props"separator="/"/>

data(){return{options:[],address:{area:[],area_ids:[],value:'',lat:'',lng:''},props:{lazy:true,//动态加载开关lazyLoad(node, resolve){//动态加载函数const{ level,value,label}= node;get("../city/get",{parentid: value
            }).then((res)=>{if(res.state =='success'){var data = res.data;
                data.map(item=>{
                  item.leaf = item.child =="0"//leaf如果是true就结束了，意味着没有下一级return item;})resolve(data);}else{resolve([]);}})}}}},

正常选择没问题。一般刚开始的options默认的是第一级的数组
最头疼的部分，在编辑表单时要显示出来前面已经选择过的项，也就是回显默认值，首先保证v-mode的值是长度是3的数组（结合情况，不一定非要是3），一定保证[省,市,区]顺序正确，我昨天大意写错了市的id，检查了一天没发现问题。
另外，既然要显示默认值，肯定也要给el-cascader一个默认的options,要保证是这种结构

[{'value':'1','label':'河南','leaf':false,//不带leaf，选项后面没有向右的箭头，下面的自行补充'children':[{'value':'11','label':'郑州','children':[{'value':'111','label':'中原区'},{'value':'112','label':'二七区'}]},{'value':'12','label':'洛阳'}]},{'value':'2','label':'河北',}]

应该很清晰了，就是保证所选路径的上下级和平级数据完整，为什么要完整，因为还有下面一个问题。
在options处理完后，默认值应该就可以正常显示了。
但是当再更换地区市，选了一下“郑州”后发现，郑州的子级重复了（选“河南”也一样），这也好理解，说明是郑州的子级又加载了一遍并且填充到下级的选项组里了，新加载的和默认的重复了。这毕竟不完美，做程序员慢慢有了强迫症了，扒了扒element的源码，问题很好解决，只是element官方没有简单明了的说出来。
在处理完options和v-model后，要处理选中项的加载状态，否则还会重新加载一次。

//上面的代码自行补充this.$nextTick(_=>{var node=this.$refs.areas.getCheckedNodes();//获取当前选中节点if(node&&node[0]&&node[0].pathNodes){//选中节点的所有父节点for(var i=0;i<node[0].pathNodes.length;i++){
                  node[0].pathNodes[i].loaded=true;//节点的加载状态设为true，就不会再加载了}}})

至此大功告成