vue Treeselect 控件:將options轉換爲合適的形式顯示

Treeselect 的options 需要的代碼格式爲 

[{ id: 11, label: 'label', children: [...] }...]

若我們接口返回的數據爲[{name: "name111, uuid: "10915", child: null}],不滿足此格式,需要以下方法轉換。

 

<treeselect
  v-model="formValue.sbid"
  :options="monitorLogicTree_options"
  :normalizer="normalizer"
  :multiple="false"
  :searchable="false"
  style="height: 100%;margin-top: 6px;"
  placeholder=" 請選擇監視設備..."/>
normalizer(node){
  //去掉children=[]的children屬性
  if(node.child == null || node.child.length==0){
    delete node.child;
  }
  return {
    id: node.uuid,
    label:node.name,
    children:node.child
  }
}

Treeselect API:  https://vue-treeselect.js.org/
 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章