vue中使用原始html插值,VUE.JS中的插值表达式、v-cloak、v-text、v-html、v-bind:、v-on:...

插值表达式

{{ x }}，类似这样子的就叫插值表达式

v-cloak

使用v-cloak 能够解决插值表达式闪烁的问题，但是要配合style中的display：none、CSS的属性选择器来使用

v-text

默认v-text是没有闪烁问题的，v-text会覆盖元素中原本的内容，但是插值表达式只会替换自己的这个占位符，不会把整个元素的内容清空

v-html

v-html命令可以使带有标签的字符串，其中的标签起到渲染的作用

v-bind:

v-bind: 是Vue中，提供的用于绑定属性的指令

注意：v-bind: 指令可以被简写为： :要绑定的属性 例如： :title

v-bind: 中，可以写合法的JS表达式

v-bind: 的简写为 :

v-on:

Vue中提供了v-on: 事件绑定机制

v-on: 的简写为 @

例如： v-on:click可以简写为 @click

附上相关代码：

Document

[v-cloak] {

display: none;

}

{{msg}}

{{msg2}}

var vm = new Vue({

el: '#app',

data: {

msg: '123',

msg2: '

哈哈，我是一个大大的H1，我大，我骄傲

',

mytitle: '这是一个自己定义的title'

},

methods: { //这个methods属性中定义了当前Vue实例所有可用的方法

show: function () {

alert('hello')

}

}

})