setup() { // 当前显示的页面组件 const currentComponent = ref('Home') // tree 数据 const treeData = ref([ { id: 1, label: 'Home', component: 'Home' }, { id: 2, label: 'About', component: 'About' }, { id: 3, label: 'Contact', component: 'Contact' } ]) // 根据选中的节点设置当前显示的页面组件 const handleNodeSelect = (data) => { currentComponent.value = data.component } return { currentComponent, treeData, handleNodeSelect, } }读取不到treeData

这段代码中的 `treeData` 是通过 `ref` 创建的响应式数据，如果要在模板中读取它，需要在模板中使用 `.value` 来访问其值。例如，可以通过以下方式读取 `treeData` 中的第一个节点的标签：

<template>
  <div>
    {{ treeData[0].label }}
  </div>
</template>

如果你想在 `setup` 函数中访问 `treeData`，则需要在 `return` 中将其作为一个属性或方法返回，如下所示：

setup() {
  const treeData = ref([
    {
      id: 1,
      label: 'Home',
      component: 'Home'
    },
    {
      id: 2,
      label: 'About',
      component: 'About'
    },
    {
      id: 3,
      label: 'Contact',
      component: 'Contact'
    }
  ]);

  const logTreeData = () => {
    console.log(treeData.value);
  };

  return {
    treeData,
    logTreeData
  };
}

在上面的示例中，我们将 `treeData` 和一个名为 `logTreeData` 的方法作为 `setup` 的返回值，这样就可以在组件中通过 `treeData` 访问响应式的 `treeData` 数据，并且可以通过 `logTreeData` 方法打印出 `treeData` 的值。