我想使用 vue-property-decorator 绑定对象的字段。以下代码应该说明我想要实现的目标:
<template>
<textarea v-model="this.box.description" placeholder="The description for the box"></textarea>
</template>
<script lang="tsx">
import { Component, Prop, Vue } from 'vue-property-decorator';
export default class BoxScreen extends Vue {
@Prop() private box!: Box;
public created() {
// init box with an Axios request
}
}
</script>
textarea
中的描述已正确初始化,但一旦我开始编辑文本,绑定似乎就不起作用了。我需要与此问题相同的解决方案,但使用 vue-property-decorator
: Vue.js bind object properties。
答案 0 :(得分:0)
我相信这个问题是因为你试图改变一个道具。请尝试以下操作:
<template>
<textarea
v-model="description"
placeholder="The description for the box"
></textarea>
</template>
<script lang="tsx">
import { Component, Prop, Watch, Vue } from 'vue-property-decorator';
export default class BoxScreen extends Vue {
@Prop() private box!: Box;
description: string;
@Watch('box.description', { immediate: true })
onChangeBoxDescription(): void {
this.description = this.box.description;
}
public created() {
// init box with an Axios request
}
}
</script>