记录一下element-ui级联选择器一些问题及解决办法

记录一下element-ui级联选择器一些问题及解决办法

最近的项目经常用到element-ui的级联选择器，但是使用该组件的过程中也遇到了不少问题，因此在此记录相关问题和解决方法，希望能帮助到遇到同样问题的朋友，有什么错误的地方欢迎指出共同进步。

▍我遇到的问题

1. 使用lazyLoad来加载数据，单次点击，切换节点遇到空数据的情况时级联面板能加载数据，但是没办法正确回显，需要再次点击时才能显示，可能导致操作人员误以为数据无变化或产生困惑感。

▍解决办法

“为了更准确的显示节点的状态，还可以对节点数据添加是否为叶子节点的标志位 (默认字段为leaf，可通过props.leaf修改)，否则会简单的以有无子节点来判断是否为叶子节点。”

这是官方文档中提及的内容，但是被我忽略了，这也是没有细读文档带来的问题。暂时没有办法理解为什么没有添加叶子节点标志位会带来这样的回显问题，但是参照官方的做法问题确实解决了，先记录一下，后面有时间再来探究。

const nodes = Array.from({ length: level + 1 })
  .map(item => ({
    value: ++id,
    label: `选项${id}`,
    leaf: level >= 2
  }));
// 通过调用resolve将子节点数据返回，通知组件数据加载完成
resolve(nodes);