vue，函数返回reactive对象，返回类型应该如何申明？

  • Z时代
  • 2024-02-17
  • 分类：IT

网上大部分是关于直接赋值的方法。
如：

interface Data {
  name: number
}
const data: Data = reactive({
  name: 1
})

这段代码运行确实不会报错，data的类型就是Data

但是，我想要实现如：

const renderData =() => {
  return reactive({
    name: 1
  })
}

这个时候不管是这样：

const renderData =(): Data => {
  return reactive({
    name: 1
  })
}

还是这样：

const renderData: Data =() => {
  return reactive({
    name: 1
  })
}

加类型都会报错，猪脑过载了，求指教。

回答：

按照 Vue 官方文档为 reactive() 标注类型的描述，确实应该如此声明类型：

interface Data {
  name: number;
}
const data: Data = reactive({
  name: 1
});

函数返回 reactive 的话，应该如下声明：

const renderData = (): Data => {
  return reactive({
    name: 1
  });
};

如果报错可能是 IDE 没有识别，可以尝试更新 IDE 的 Vue 插件版本，或者是手动指定泛型：

const renderData = (): Data => {
  return reactive<Data>({
    name: 1
  });
};
不推荐使用 reactive() 的泛型参数，因为处理了深层次 ref 解包的返回值与泛型参数的类型不同。

以上是 vue，函数返回reactive对象，返回类型应该如何申明？ 的全部内容， 来源链接： utcz.com/p/934808.html

回到顶部