[vue+typescript]Property or method "xxx" is not defined on the instance but referenced during render

vue-cli3 创建 TypeScript 项目时，在使用 @Prop时 报错：

Property or method "xxx" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property

 

找了一些答案，发现都对不上自己的错误，在stackoverflow中，找到一个相似问题的回答，说是要对typescript配置对应的一个loader，配置内容如下：

最后还是没用，依旧报错，捣鼓一番之后，解决了问题

针对于 vue-cli3 创建的typescript项目，基于 vue-property-decorator(非官方)

采用vue-class-component（Vue官方） 对 Vue 项目做 typescript 做迁移出现了这个问题的话，应该是上面的那种配置loader的解决方案

因为 没有 对组件中 写 @Component() 装饰器，导致的报错。

事实证明 ： @Component() 装饰器的重要性

 

如果还不是上面的问题导致的 ，那么 你一定是声明了一个undefined的变量 。

声明了一个 变量 currentSearchResult 为undefined 或 object 类型。 但是其值起初是undefined ，所以会导致上面的错误。

需要将其赋值为空对象 ：