vue3不使用lang=ts如何使用elementPlus组件 el-tree 中的setchecked

在Vue 3中不使用lang="ts"时，可以使用JavaScript编写代码来使用Element Plus组件ElTree中的setChecked方法。下面是一个示例：

1. 首先，确保安装了Element Plus和Vue 3：

npm install element-plus@next
npm install vue@next

2. 在Vue文件中导入ElTree组件和相关依赖：

import { ref, onMounted } from 'vue';
import { ElTree, ElButton } from 'element-plus';

3. 在Vue组件中定义数据和方法：

export default {
  components: {
    ElTree,
    ElButton,
  },
  setup() {
    const treeData = ref([
      {
        id: 1,
        label: 'Node 1',
        children: [
          {
            id: 2,
            label: 'Node 1-1',
          },
          {
            id: 3,
            label: 'Node 1-2',
          },
        ],
      },
      {
        id: 4,
        label: 'Node 2',
        children: [
          {
            id: 5,
            label: 'Node 2-1',
          },
          {
            id: 6,
            label: 'Node 2-2',
          },
        ],
      },
    ]);

    const treeRef = ref(null);

    const setChecked = () => {
      const checkedKeys = [1, 3, 5]; // 设置选中的节点id
      treeRef.value.setCheckedKeys(checkedKeys);
    };

    onMounted(() => {
      // 初始化树节点选中状态
      setChecked();
    });

    return {
      treeData,
      treeRef,
      setChecked,
    };
  },
};

4. 在Vue模板中使用ElTree组件和按钮来触发setChecked方法：

<template>
  <div>
    <el-tree :data="treeData" :ref="treeRef"></el-tree>
    <el-button @click="setChecked">Set Checked</el-button>
  </div>
</template>

在上面的示例中，treeData是树的数据，treeRef是ElTree组件的引用，setChecked方法会在组件挂载时被调用来设置节点的选中状态