访问构造函数 vuejs 中的 props

Question

我正在寻找从 VueJS 中的构造函数访问 props。

我尝试了如下图所示的反应方式，但当时没有任何成功。

父母：

<nb-add-card
test="test props">
</nb-add-card>

孩子：

<template>
<div>
test : {{ test }}
</div>
</template>
<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
@Component({
components: { },
props: {
test: {
type: String,
default: "",
required: true
},
},
})
export default class AddCard extends Vue {
constructor(props: any) {
super(props);
console.log('TEST :', props); // => Undefined
console.log('TEST1 :', this); // => Refer to AddCard
}
}
</script>

日志"测试"仍然"未定义"。 现在被困在这个上面几个小时了，在反应中，我们只是简单地在构造函数参数中传递"props"，但在 vuejs 中，它似乎不起作用...... ：/

我还通过编写nb-add-card>的道具名称来测试访问 props 值<但它也不起作用......>

constructor(test: any) {
super(test);
console.log('TEST :', test); // => Undefined
console.log('TEST1 :', this); // => Refer to AddCard
}

有人有想法吗？谢谢的

Answer 1

构造函数对 vue-class-component 没有用。要导出的是构造函数本身。您的"测试"变量可立即在组件中访问。使用"已创建"或"已挂载"钩子来记录它。