格雅百科

vue中的input使用e.target.value赋值的问题

格雅百科
-->

很久不写博客了。。。

vue中对表单的处理,相对原生js,增加了一个双向绑定的语法糖:v-model。官方文档里有一段:

v-model 会忽略所有表单元素的 valuecheckedselected 特性的初始值而总是将 Vue 实例的数据作为数据来源。你应该通过 JavaScript 在组件的 data 选项中声明初始值。

这段话很重要。我们知道,input有各种原生事件(oninput,onchange等),而原生事件里可以用e.target.value对输入框进行赋值。这时候就有个问题了,对e.target.value渎职和v-model绑定的数据直接修改有什么冲突吗?

答案是有的,有可能造成数据不统一的情况:页面上显示的值与绑定的值不一致。

如果要进行校验等操作,可以修改v-model绑定的值,而不是修改e.target.value。

  上面这个例子里就会出现数据不统一的情况。页面显示6,而获取this.value真实值是64。

-->

发表评论 (已有0条评论)

还木有评论哦,快来抢沙发吧~