vue中 v-model 和 :model 的区别
·
今天在写demo的时候发现一件奇怪的事:
当我在给 input 元素使用 v-model 的缩写形式 :model 时,想要绑定的数据并没有渲染到浏览器中

然鹅,改为 v-model 之后就能成功渲染了

于是经过我一番研究发现 :model 其实相当于 v-bind:model 的缩写,对于我想要绑定的 input 的值应该使用 v-bind:value ,所以如果在 input 元素上想要使用缩写形式应该是 :value ,经过我的试验发现这种缩写形式确实是可行的,数据可以成功渲染到浏览器

v-model:
v-model 是 v-model:value 的缩写,通常用于表单上的双向数据绑定(表单接受值 value,故v-model默认收集的就是 value ,所以缩写直接省略 value),可以实现子组件到父组件的双向数据动态绑定。数据不仅能从data流向页面,还可以从页面流向data。
:model:
:model 是 v-bind:model 的缩写,可以实现将父组件的值传递给子组件,但是子组件不能传给父组件,无法双向绑定。
v-bind:
v-bind:value 可以简写为 :value ,数据只能从data流向页面。
AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。
更多推荐


所有评论(0)