我想从输入传递数据:
<input
id="txtName"
type="text"
v-on:keyup.enter="addMessage(/* THIS FIELD VALUE */)"
/>
方法:
methods: {
addMessage(name) {
//stuff
}
}
我尝试使用 this
或 this.value
作为参数,但它不起作用。
我该如何解决?
最佳答案
您可以使用 v-model
将数据属性绑定(bind)到输入,并在您的方法 ( see this fiddle) 中简单地引用它:
<input v-model="message" @keyup.enter="addMessage()"/>
methods: {
addMessage() {
this.messages.push(this.message);
}
}
或者,您可以使用特殊的内联 $event
属性,它为您提供对目标元素值 ( see this fiddle) 的引用:
<input @keyup.enter="addMessage($event)"/>
methods: {
addMessage(e) {
this.messages.push(e.target.value);
}
}
您也不需要显式地将 $event
参数传递给 @
处理程序。您可以只将方法名称传递给处理程序,第一个参数仍然是 $event
的值。
像这样:
<input @keyup.enter="addMessage"/>
methods: {
addMessage(e) { // e is the value of $event
this.messages.push(e.target.value);
}
}
关于vue.js - 将数据从输入传递到 vue 的函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45839690/