在Vue 2.x版本中,如果您想定义props或data的类型,请使用vue-property-decorator库提供的装饰器: 安装依赖:npm install vue-property-decorator
在组件中使用装饰器:import { Component, Vue, Prop } from 'vue-property-decorator';
@Component
export default class MyComponent extends Vue {
@Prop(Number) readonly propA!: number;
@Prop({ default: 'default value' }) readonly propB!: string;
@Prop([String, Boolean]) readonly propC: string | boolean;
data: {
count: number;
message: string;
} = {
count: 0,
message: 'Hello!'
};
}
在Vue 3.x版本中,您可以直接使用Typescript的语法来定义数据类型:
import { defineComponent } from 'vue';
export default defineComponent({
name: 'MyComponent',
props: {
propA: {
type: Number,
required: true
},
propB: {
type: String,
default: 'default value'
},
propC: {
type: [String, Boolean]
}
},
data() {
return {
count: 0,
message: 'Hello!'
};
}
});
如果还有问题,建议提供您的代码和报错信息,以便更详细的解答。
|