vue中如何重新获取数据_Vue+TypeScript中如何处理computed

什么是「computed」

「computed」是Vue中提供的一个计算属性。它被混入到Vue实例中，所有的getter和setter的this上下文自动的绑定为Vue实例。

计算属性的结果会被缓存，除非依赖的响应式property变化才会重新计算。

「computed」的用途

我们可以使用「computed」对已有的属性数据进行加工处理，得到我们的目标数据。

在TypeScript怎么用

在「vue-class-component」中分别为props，watch等提供了对应的装饰器，而「computed」却没有对应的装饰器提供。

在官网 https://class-component.vuejs.org/guide/class-component.html#computed-properties 的实例中，「computed」的功能是通过 「get」实现的。

另一种方案

在实际项目中，将组件修改为TypeScript后，使用 get 实现计算属性，浏览器控制台提示data是非响应式的，数据无法显示。

组件js版

鉴于这个问题，使用创建中间变量的方式进行解决。

组件ts版

总结

Vue+TypeScript的道路是曲折而又充满荆棘的，还有内心足够强大。哈哈

---

个人公众号：Java码农