Vue处理表单输入单行文本框的实例代码

  

用vue监听单行文本框是最最最容易的事。

  

只需用到v模型就能监听。

        & lt; template>   & lt; div id=坝τ谩北?   & lt;输入类型=拔谋尽眝模型=拔毒北?   & lt; p>{{味精}}& lt;/p>   & lt;/div>   & lt;/template>      & lt; script>   出口默认{   名称:“应用程序”,   数据(){   返回{   味精:“   }   }   }   & lt;/script>      之前      

在数据里面创建一个味精变量,用来存储输入框的输入的内容。

  

在输入用v模型绑定味精。

  

这时输入框输入的所有内容,都会实时更新到味精里。

  

所以& lt; p>标签里的内容也会实时更新输入框所输入的内容。

  

 Vue处理表单输入单行文本框的实例代码

  

如上图所示。

  

需要注意的是,用了v模型后,输入框在输入内容时,输入的值是没有变化的。因为v模型并不是指向输入的值。

  

  

以上所述是小编给大家介绍的Vue处理表单输入单行文本框的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留的言,小编会及时回复大家的。在此也非常感谢大家对网站的支持。
  如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Vue处理表单输入单行文本框的实例代码