@change 不会触发以编程方式更改的值
我有以下带有更改事件的文本区域.
I have the below textarea with a change event.
<textarea @change="inputChanged" ref="input">
当我手动输入数据时，会调用inputChanged".但是，当我使用页面顶部的按钮以编程方式更新值时.
When I manually enter data 'inputChanged' is called. However when I used a button that that is at the top of the page to update the value programatically.
this.$refs.input.value = "Hello";
textarea 更新为 'Hello' 但为 'inputChanged'.不叫.
The textarea updates with the value 'Hello' however 'inputChanged'. Is not called.
这是为什么?以及如何在编程文本区域更改时首先获得更改事件?理想情况下，我不想使用 JQuery.
Why is this? And how can I get the change event to first on programatic textarea change? Ideally I don't want to have to use JQuery.
您可以使用 v-model 绑定文本区域，然后使用计算属性来获取/设置值.查看文档此处
You can bind the text area using v-model and then use a computed property to get/set the value. Check out the documentation here
<textarea v-model="text">
打字稿
computed:{
text:{
get(){
return this.$refs.input.value;
},
set(value){
if(this.$refs.input.value != value){
this.$refs.input.value = value;
// Do other stuff here
}
}
}
}