vue 基础 v-text v-html v-model v-cloak v-bind

v-text  纯文本绑定

v-html  会解析html标签

<p v-html="rawHtml"></p>

var a=new Vue({
    el:"#app",                 //绑定的元素
    data:{
        rawHtml:'<span style="color:red">利用vue添加了插入一个span 元素</span>', //元素内数据代码 message
    }
});

 

v-model 双向绑定  适用于input标签

v-cloak   div内变量编译完毕后才会显示

<p v-cloak>{{message}}</p>

message:"这是v-clock"

[v-cloak] {
    display: inline;
}

 

v-bind  用于绑定 html 属性

<img v-bind:src="src" alt="">

src: "https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1819216937,2118754409&fm=26&gp=0.jpg"