vue element-ui tree树形控件中默认选中和回显问题

问题：

我们使用树形控件在编辑时候有时候，会遇到回显数据是上一条回显给的数据。这个问题是由于我们的树形控件没有重新渲染导致的。比较笨的方法是每次编辑的时候重新加载一遍树形控件然后再进行回显选中的数据。不过这样会导致页面多次渲染影响加载速度和性能。

解决办法：

1，通过 this.$refs.tree组件上自定义ref名.setCheckedKeys(this.defaultList)

<el-tree
  ref="tree"
  :data="dataList"
  show-checkbox
  default-expand-all
  check-strictly
  :default-checked-keys="defaultList"//数组中是rightsList中有权限的id值,与node-key对应
  node-key="id" // 通过此方式必须设置该项
  :props="{label: 'name'}"
/>
data() {
    return {
      dataList: [name:123,id:1,name:345,id:2],
      defaultList: [1,2]
    }
},
created(){
    1.this.$refs.tree.setCheckedKeys(this.defaultList) 
    // 如果发现还是没有渲染,可能是dom树渲染的问题,通过this.$nextTick(() => {})解决
    2.this.$nextTick(() => {
        this.$refs.tree.setCheckedKeys(this.defaultList)
    })

}

注意点：

获取被选中节点 通过: this.$refs.tree.setCheckedKeys()

console.log(this.$refs.tree.getCheckedKeys())

// 得到一个数组,数组中是与node-key="id"对应的id值

// [1,2]