如何在Vue.js中调整文本字段的反应性
如何在Vue.js中调整文本字段的反应性
提问于 2019-02-15 08:34:05
我在Vue.js中有一个简单的文本字段：
new Vue({
el: '#app',
data: {
value: 'Test'
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<input type="text" v-model="value" ref="input" />
<p>{{ value }}</p>
</div>
是否有可能将数据模型中的值从“onChange”更新到“onBlur”？
回答 2
Stack Overflow用户
回答已采纳
发布于 2019-02-15 08:43:06
V-模型只是=>的语法糖。
:value="modelValue“@input=modelValue=$event.target.value
如果你想要别的东西，这很容易做。只需将更新端更改为onBlur，所以=>
<input class="form-control
:value="value"
@blur="value = $event.target.value"
@input="value = $event.target.value"
>改进的示例代码：
new Vue({
el: '#app',
data: {
value: 'Test'
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<input
type="text"
:value="value"
@blur="value = $event.target.value"
ref="input"
/>
<p>{{ value }}</p>
</div>
Stack Overflow用户
发布于 2019-02-15 08:53:41
是的，您应该添加@blur事件，并将事件的值传递给它。
然后，当在methods中触发此事件时，它将将result的值更改为输入value...so，而更新仅以输入的blur为条件。
new Vue({
el: '#app',
data: {
result: '',
value:''
},
methods:{
blo(e){
this.result = e
}
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="app">
<div id="app">
<input type="text" @blur='blo(value)' v-model="value" />
<p>{{ result }}</p>
</div>
</div>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/54705301
复制相关文章
相似问题
腾讯云开发者
