treeselect组件 回显数据时,值后面有unknown怎么解决

Question

数据回显时,值后面有unknown,

只有在我点击父节点时 才会加载 只节点 这个时候才会显示出来 那这样的话 有什么办法可以处理

 <treeselect
                              name="hostDeptId"
                              :options="deptDatas"
                              :load-options="loadDepts"
                              :show-count="true"
                              :appendToBody="true"
                              placeholder="选择部门"
                              v-model.number="scope.row.hostDeptId"
                            />

    // 获取弹窗内部门数据
    loadDepts({ action, parentNode, callback }) {
      if (action === LOAD_CHILDREN_OPTIONS) {
        getDepts({ status: true, pid: parentNode.deptId }).then(res => {

          parentNode.children = res.data.data.rows.map(function (obj) {
            if (obj.hasChildren) {
              obj.children = null
            }
            return obj
          })
          setTimeout(() => {
            callback()
          }, 200)
        })
      }
    },
    // 获取部门列表
    getDepts() {
      getDepts({ status: true }).then(res => {
        this.deptDatas = res.data.data.rows.map(function (obj) {
          if (obj.hasChildren) {
            obj.children = null
          }
          return obj
        })
      })
    },

Answer 1

我暂时能想到的是用 自定义值标签。

<treeselect :options="options" :value="value" :multiple="multiple">
    <div slot="value-label" slot-scope="{ node }">{{ getDeptName(node.raw.customLabel) }}</div>
  </treeselect>

getDeptName(name) {
        if (name.lastIndexOf("unknown") > -1) {
        //当treeselect翻译不了值时，name中有id，截取id，去调接口或者字典查询出名字
          return '获得的名字';
        } else {
          return name;
        }
},