我是Vue和Nuxt的新手。目前正在使用TypeScript的教程。它抛出了一堆Property 'x' does not exist on type 'y'.
的错误下面的例子;
ERROR in components/AboutMe.vue:56:27
TS2339: Property 'routes' does not exist on type '{ components: { CButton: any; }; props: { user: { type: ObjectConstructor; default: undefined; }; }; data(): { expand: boolean; showTitle: boolean; showReadMore: boolean; routes: string[]; compiledBio: string; }; beforeMount(): void; mounted(): void; }'.
54 | },
55 | mounted() {
> 56 | this.showTitle = this.routes.every((r) => this.$route.name !== r)
| ^^^^^^
57 | if (this.$route.name === `users-userSlug`) {
58 | this.expand = true
59 | this.showReadMore = false
其他的有Property 'showTitle' does not exist
、'expand'
等。基本上,this.
的所有内容都会抛出错误。
这是AboutMe.vue
组件的<script
块。
<script lang="ts">
import { CButton } from '@chakra-ui/vue'
export default {
components: {
CButton,
},
props: {
user: {
type: Object,
default: undefined,
},
},
data() {
return {
expand: false,
showTitle: false,
showReadMore: true,
routes: [`users-userSlug-posts`, `users-userSlug`],
compiledBio: ``,
}
},
mounted() {
this.showTitle = this.routes.every((r) => this.$route.name !== r)
if (this.$route.name === `users-userSlug`) {
this.expand = true
this.showReadMore = false
}
},
}
</script>
我做错了什么?
我正在使用nuxt.js(v2.14.6)
@BoussadjraBrahim编辑1
我添加了Vue.extend({})
,现在大多数错误都消失了。但其中一些仍然存在。
ERROR in components/Description.vue:138:10
TS2339: Property 'showAboutUs' does not exist on type 'CombinedVueInstance<Vue, unknown, unknown, unknown, Readonly<{ post: any; }>>'.
136 | },
137 | mounted() {
> 138 | this.showAboutUs = this.$route.name !== `users-userSlug-posts`
| ^^^^^^^^^^^
139 | },
140 | methods: {
141 | open() {
ERROR in components/Description.vue:142:12
TS2339: Property 'isOpen' does not exist on type 'CombinedVueInstance<Vue, unknown, unknown, unknown, Readonly<{ post: any; }>>'.
140 | methods: {
141 | open() {
> 142 | this.isOpen = true
| ^^^^^^
143 | },
144 | close() {
145 | this.isOpen = false
export default Vue.extend({
data() {
const showAboutUs: Boolean = false
const isOpen: Boolean = false
return {
showAboutUs,
isOpen,
}
},
mounted() {
this.showAboutUs = this.$route.name !== `users-userSlug-posts`
},
methods: {
open() {
this.isOpen = true
},
close() {
this.isOpen = false
},
},
})
2条答案
按热度按时间s4n0splo1#
要获得类型推断,您应该使用
Vue.extend({})
创建组件:我建议键入数据属性以强制组件类型:
qacovj5a2#
尝试使用
Vue.extend({})
示例:
希望这对你有帮助