Vue.js从入门到跑路-模板语法

上文我们提到了模板语法，除了最常用的文本插值，我们还需要学会以下几种

插入 html:v-html（不推荐不建议使用）

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

span 的内容会被 v-html 里的内容替代

绑定属性

<div v-bind:id=id></div>

这行代码的意思是将组件中的 id 属性和元素的 id 进行绑定
我们可以将 v-bind:简写成: 即

<div :id=id></div>

由于我们的组件中的 id 属性和元素中的 id 同名，我们还可以简写成

<div :id></div>

绑定的属性支持布尔型，我们以一个按钮为示例，我们可以通过绑定 disabled 来控制按钮的可用性

<button :disabled="isButtonDisabled">Button</button>

在所有的数据绑定中，都支持 JavaScript 表达式，如：

{{ number + 1 }}

v-bind 支持绑定 style 和 class 属性，表达式的值除了字符串，你还可以设置数组或者对象