2.1 语法 2.1.1插值 1：文本插值：使用{{}}形式，代码如下({{text}}会随text值的变化而变化)：
<span>{{text}}</span>2：有时候值需要渲染一次数据，然后不再关心后续数据变化，可以通过*来实现，代码如下：
<span>{{*text}}</span>3：{{}}会把里面的值全部当做字符串来处理，如果值是HTML片段，则可以使用{{{}}},代码如下：
logo:'<span>logo</span>' <div>{{{logo}}}</div>4：{{}}还可以放在HTML标签内，代码如下：
<li data-id='{{id}}'></li>2.1.2 表达式 Mustache标签可以接受表达式形式的值，表达式可以是JS表达式或者过滤器； 1：JS表达式：
{{cents/100}} {{true?1:0}} {{example.split(',')}}无效实例：
{{var logo='ddee'}} //这是语句，不是表达式 {{ if(true) return 'ddee' }} //不支持条件控制语句2：过滤器的2种写法
<template> <div> <ul> <li v-for="(item,index) in arry"> {{ item.name | capitalize(index) }} </li> <li v-for="(item,index) in arry"> {{ showName(item,index) }} </li> </ul> </div> </template> <script> export default { name: 'HelloWorld', data () { return { arry:[ { name:'销毁1', age:10 }, { name:'销毁2', age:20 }, { name:'销毁3', age:30 }, { name:'销毁4', age:40 }, { name:'销毁5', age:50 }, { name:'销毁6', age:60 }, { name:'销毁7', age:70 }, ] } }, //过滤器的写法，第一个参数是html中|前面的变量，然后才会跟传送进来的index filters: { capitalize: function (name,index) { if(index>3){ return name; } } }, methods:{ showName(item,index){ if(index>3){ return item.name; } } } } </script> <!-- Add "scoped" attribute to limit CSS to this component only --> <style scoped> h1, h2 { font-weight: normal; } ul { list-style-type: none; padding: 0; } li { display: inline-block; margin: 0 10px; } a { color: #42b983; } </style>2.1.3 指令 指令是带有V-前缀的特殊字符，值限定为绑定表达式，指令的作用是当表达式的值发生变化时，将这个值变化也放映到DOM上，代码如下：
<div v-if='show'>DDEE</div> //show为true时，展示DDEE字样，否则不展示 <div v-bind:href='url'>DDEE</div>2.2 分隔符 VUE中数据绑定的语法被设计为可配置的，不过不习惯Mustache风格的语法，可以自己设置 Vue.config是一个对象，包含了Vue.js的所有全局配置 分隔符在Vue.config中源码定义如下：
let delimiters=['{{', '}}'] let unsafeDelimiters=['{{{', '}}}']1:delimiters
Vue.config.delimiters=["<%" ,"%>"] //{{example}} <%example%>2:unsafeDelimiters
Vue.config.unsafeDelimiters=["<$" ,"$>"] //{{{example}}} <$example$>