操作环境

Vue3
Element Plus

问题重现

<template>
  <el-tree
    ref="treeRef"
    :data="data"
  />
  </template>
  <script lang="ts" setup>
    // 引入必要组件
    getTreeData()
    .then((res) => {
    data.value = res.data
    treeRef.value.setChecked();
    })
  </script>

本想在给tree组件赋值的时候，一并设置选中值，但是并没有生效，于是测试了下，发现treeRef.value.data为空，也就是此时的tree组件仍为赋值之前的组件，是不是真的如此，可以使用onUpdated测试下，在onUpdated下可以获取到data值，但是只能在onUpdated中进行后续操作了吗？其实不然，还有更简单的办法

解决办法

<template>
  <el-tree
    ref="treeRef"
    :data="data"
  />
  </template>
  <script lang="ts" setup>
    // 引入必要组件
    getTreeData()
    .then((res) => {
    data.value = res.data
    }).finally(() => {
    treeRef.value.setChecked();
    })
  </script>

虽然then中无法进行操作，那么在finally中呢，then完成操作之后就会进入finally中，此时dom已经被更新，finally中获取的就是更新后的dom，此时可以进行下一步操作。