v-bind和v-model的区别

v-bind 用来绑定数据和属性以及表达式,缩写为" : "
v-model 使用在表单中,实现双向数据绑定的,在表单元素外使用不起作用:可以绑定text、radio、checkbox、selected

v-bind 

1.绑定文本

直接用v-bind或者{{}}

<p v-bind="message"></p>
<p>{{message}}</p>

2.绑定属性

<p v-bind:src="http://...."></p>
<p v-bind:class="http://...."></p>
<p v-bind:style="http://...."></p>

3.绑定表达式

{{ number + 1 }}
{{ ok ? 'YES' : 'NO' }}
{{ message.split('').reverse().join('') }}

4.绑定html

<div>{{{ raw_html }}}</div>

这个时候必须要使用三个{}

 

v-model

1. 绑定text

2. 绑定radio

3. 绑定checkBox

4. 绑定select

5. 增加参数

posted @ 2020-03-13 12:56  格鲁特baby  阅读(254)  评论(0编辑  收藏  举报