效果;

html程式碼

<el-select
    v-model="selectTree"
    placeholder="請選擇..."
    size="mini"
    clearable
    ref="select"
>
    <el-option hidden key="id" :value="selectTree" :label="selectName" />
    <el-tree
        :data="treeData"
        :props="defaultProps"
        @node-click
 
="handleNodeClick"
        :expand-on-click-node="false"
        :check-on-click-node="true"
        ref="tree"
        node-key="id"
    >
    </el-tree>
</el-select>

el-option的selectName用來顯示選擇的資料(遠大公司)，value儲存遠大公司的id

js程式碼

// 報警型別
let alarmTypeList = ref([])

// 下拉樹
const select = ref() 
let selectTree 
 
= ref('')
let selectName = ref('') 
let treeData = ref([]) // 樹資料，介面獲得
const defaultProps = ref({
    label: 'name',
    children: "children"
})
const handleNodeClick = (data) => {
    searchForm.orgId = data.id; //  給表單資料項賦值
    selectName.value = data.name; // 框中顯示值為label
    select.value.blur() // 關閉下拉窗
}