el-tree 动态指定默认选中节点

核心代码

• highlight-current 高亮选中节点
• node-key="label" 指定以哪个属性为唯一识别的 key
• :current-node-key="current" 自定义current变量，存储默认选中节点对应的key值
• v-if="current" 因是动态绑定，最开始current为空，所以需在current有值后，才渲染 el-tree

完整演示代码

<template>
    <el-tree
            v-if="current"
            node-key="label"
            :current-node-key="current"
            :default-expand-all="true"
            :expand-on-click-node="false"
            highlight-current
            :data="data"
            :props="defaultProps"
            >
    </el-tree>
</template>
<script>
    export default {
        mounted() {
            this.current = '成都市'
        },
        data() {
            return {
                current: '',
                defaultProps: {
                    children: 'children',
                    label: 'label'
                },
                data: [
                    {
                        label: '四川省',
                        children: [
                            {
                                label: '成都市',
                                children: [
                                    {label: '武侯区'}
                                ]
                            }
                        ]
                    },
                    {
                        label: '湖北省',
                        children: [
                            {label: '武汉市'}
                        ]
                    }
                ]
            }
        }
    }
</script>