今天項目中在實現 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>
頁面效果：