1. 程式人生 > 實用技巧 >vue Ant Design 樹選擇使用(選中子節點顯示各級父節點;選中父節點不選中子節點)

vue Ant Design 樹選擇使用(選中子節點顯示各級父節點;選中父節點不選中子節點)

效果圖:

 <a-descriptions-item label="治療方式">
            <a-form-model-item prop="treatments">
              <template>
                <a-tree-select
                  labelInValue
                  v-model="otherFrom.treatments"
                  show-search
                  style
="width: 100%" :value="otherFrom.treatments" :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }" :tree-data="treatmentData" placeholder="請選擇治療方式" allow-clear multiple tree
-default-expand-all @change="onChange" @search="onSearch" @select="onSelect" > </a-tree-select> </template> </a-form-model-item> </a-descriptions-item>
方法:
methods: { onChange(value, e) { console.log(value);
for (let i = 0; i < value.length; i++) { value[i].label = value[i].value; } this.otherFrom.treatments = value; }, }