vue3 element plus el-tree树形控件懒加载默认展开

这里有一个主要点：异步异步

废话不多说直接上代码：三步骤

第一步：

<el-tree
    :props="props"
    :load="loadNode"
    lazy
    :default-expanded-keys="a"    //重点，使用变量代替
  />

第二步:

<script setup>
let treeData = ref([
  {
    id: 1,
    name: '我是第一层',
    children: [],
  },
])
let a = ref() //第二步，定义变量  默认展开

// 获取数据
const loadNode = async (node, resolve) => {
  // 根节点
  if (node.level === 0) {
    resolve(treeData.value)
    a.value = [1]    //第三步，赋值数据以后再展开 重点
    return
  }

  // 根节点展开数据
  if (node.level === 1) {
    console.log(node, resolve)
    // 获取数据
    let res = await treeselect2()
    // 存入数据
    treeData.value[0].children = res.data

    return resolve(res.data)
  }

  let unid = node.data.id
  let res = await treeselect(unid)
  console.log(res)

  return resolve(res.data)
}

</script>