vue3 setup 调用函数
    在Vue3中，我们可以使用 `setup` 函数来进行组件的初始化。除了可以定义响应式数据、计算属性、方法等以外，`setup` 函数也可以调用其他函数，并在组件中使用。
    下面是一个简单的例子，展示了在 `setup` 函数中调用一个函数，并将其返回值作为响应式数据：
    ```js
    import { reactive, toRefs } from 'vue'
    function fetchData() {
    // 模拟一些异步数据
    return new Promise(resolve => {
    setTimeout(() => {
    resolve({ na 'vue3', version: '3.0.5' })
    }, 1000)
    })
    }
    export default {
    setup() {
    const state = reactive({
    data: {}
    })
    async function initData() {
    const res = await fetchData()
    state.data = res
    }
    initData()
    return {
    ...toRefs(state)
    }
    }
    }
    ```
    在上面的代码中，我们定义了一个 `fetchData` 函数，它会返回一个 Promise 对象，模拟了一些异步数据的场景。在 `setup` 函数中，我们调用了 `fetchData` 函数，并将其返回值赋
值给了 `state.data`，以便在组件中使用。
vue中reactive    需要注意的是，我们在 `initData` 函数中调用了 `fetchData` 函数，并使用了 `async`/`await` 语法来等待异步数据的返回。这样做是为了保证在组件挂载完成后，异步数据已经准备好，可以正常渲染到页面上。
    在返回值中，我们使用了 `toRefs` 函数将 `state` 转换为响应式数据，以便在组件中使用。这个函数会将 `state` 中的所有属性转换为 `ref` 对象，以便在组件中使用时能够实现响应式更新。
    总的来说，在 `setup` 函数中调用其他函数非常方便，可以帮助我们更好地组织代码，并将异步数据的获取逻辑等独立出来，提高代码的可维护性。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。