成都网站建设设计

将想法与焦点和您一起共享

vue指令之表单控件绑定v-modelv-model与v-bind结合使用

一、表单控件绑定v-model

创新互联长期为上千家客户提供的网站建设服务,团队从业经验10年,关注不同地域、不同群体,并针对不同对象提供差异化的产品和服务;打造开放共赢平台,与合作伙伴共同营造健康的互联网生态环境。为澄迈企业提供专业的成都做网站、网站制作,澄迈网站改版等技术服务。拥有十余年丰富建站经验和众多成功案例,为您定制开发。

v-model 双向数据绑定;一般用于表单元素,会忽略表单元素的value、checked、selected的初始值,且将Vue实例的数据作为数据来源。

① 单行文本框 input[type="text"] 、多行文本框 textarea:

v-model值绑定到value属性;


  


ps:下面看下Vue v-bind v-model的使用

v-model 指令在表单控件元素上创建双向数据绑定,所谓双向绑定,指的就是我们在js中的vue实例中的data与其渲染的dom元素上的内容保持一致,两者无论谁被改变,另一方也会相应的更新为相同的数据

最基础的就是实现一个联动的效果


  
Multiline message is:

{{message}}


checkbox


  

Checked names:{{checkedNames}}

v-bind

有些指令可以在其名称后面带一个“参数” (Argument),中间放一个冒号隔开。例如,v-bind 指令用于响应地更新 HTML 特性

总结

以上所述是小编给大家介绍的vue指令之表单控件绑定v-model v-model与v-bind结合使用 ,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对创新互联网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!


当前标题:vue指令之表单控件绑定v-modelv-model与v-bind结合使用
本文路径:http://chengdu.cdxwcx.cn/article/gscjjp.html