我正在尝试学习vue.js
。但是官方文档中的代码不起作用。我找不到原因。Vue 告诉我们,Property "PROPERTY_NAME" was accessed during render but is not defined on instance.
但是这个属性是在props
组件中定义的,就像在手册中一样。我发现,从版本 3.4 开始我应该使用defineModel
SFC,但现在它只是有点复杂。我想要简单的方法,index.html
现在在一个文件中,无需导出,一个文件 - 一个组件等。
代码是:
<div id="app">
<test-component v-model:first-name="firstName" v-model:last-name="lastName"></test-component>
</div>
<script>
Vue.createApp({
components: {
'test-component' : {
props: {
firstName: String,
lastName: String
},
emits: [ 'update:firstName', 'update:lastName'],
template: `
<input type="text" :value="firstName" @input="$emit('update:firstName', $event.target.value)"/>
<input type="text" :value="lastName" @input="$emit('update:lastName', $event.target.value)"/>
`
}
}
}).mount('#app');