如何从Nuxt3的setup函数返回非响应式原始数据对象？

你可以通过Vue提供的unref()工具函数提取useAsyncData返回的响应式数据的原始值，以此避免保留大型响应式对象带来的性能开销。

具体实现步骤 #

1. 保留原有的useAsyncData数据获取逻辑；
2. 调用unref()提取原始的非响应式数据；
3. 将原始数据返回给选项式API的其他方法使用。

修改后的代码示例：

const { data: asyncData } = await useAsyncData(() => d3.csv(url))
// 提取原始非响应式数据
const rawData = unref(asyncData)
// 返回原始数据供选项式API方法调用
return { rawData }

补充说明 #

• unref()是Vue内置工具函数，会自动判断传入值：如果是ref对象则返回其.value属性（即原始数据），如果不是则直接返回原值；
• 由于你已经用await等待useAsyncData执行完成，此时asyncData已包含完整的CSV数据，调用unref()可以安全获取原始数据；
• 返回原始数据后，在选项式API的方法中直接通过this.rawData访问即可，无需处理响应式代理，彻底消除静态大对象的响应式追踪开销。

内容的提问来源于stack exchange，提问作者Sergi Serman