vue Treeselect 树形下拉框出现unknown

今天项目中在实现 VueTreeselect 树形下拉框时，出现 unknown，如下图：

实现代码如下：

<el-form-item 
          :label="$t('sysManage.department.table.parDepart')">
          <treeselect
            :options="preDepartTreeData"
            :normalizer="normalizer"
            v-model="oneDepart.parentId"
            :placeholder="$t('sysManage.department.parDepartInput')"
          ></treeselect>
</el-form-item>
<script>

const defaultDepart = {
  desc: "",
  id: "",
  name: "",
  deptType: 0,
  parentId: "",
  idxno: 0
}
export default {
  components: {
    Treeselect
  },
  data() {
    return {
      oneDepart: Object.assign({}, defaultDepart)
    }
  }
}
</script>

后来查资料发现：

当下拉树是单选的时候，绑定的值设为null，不能是‘null’或" "，只有这样，初始化的时候才不会出现unknown

解决办法：

把v-modle绑定的值设为null，必须是null，不能是‘null’，初始化的时候才不会出现unknown。

<el-form-item 
          :label="$t('sysManage.department.table.parDepart')">
          <treeselect
            :options="preDepartTreeData"
            :normalizer="normalizer"
            v-model="oneDepart.parentId"
            :placeholder="$t('sysManage.department.parDepartInput')"
          ></treeselect>
</el-form-item>
<script>

const defaultDepart = {
  desc: "",
  id: "",
  name: "",
  deptType: 0,
  parentId: null,
  idxno: 0
}
export default {
  components: {
    Treeselect
  },
  data() {
    return {
      oneDepart: Object.assign({}, defaultDepart)
    }
  }
}
</script>

 

页面效果：