在html中插入数据控件有2种方式，一种是{ {}}双花括号，一种是directive,类似v-on:click这种写法
<span v-once>This will never change: { { msg }}</span>
这样视图中的msg就不会变了。
过滤器
{ { float_number | toInt }
new Vue({
el: '#app', data: { float_number: 3433.45 }, filters: { //filters属性关键字，过滤器不过是一个方法， toInt: function (aaa) { return parseInt(aaa); } //toInt是一个方法 } })
过滤器参数
既然过滤器是方法，当然可以加入参数：
{ { message | filterA 参数1，参数2 }}
参数不是用括号括起来，而是空格在后面直接写，不同参数用逗号分隔，参数这个地方可以写一个具体的值，也可以写一个表达式，具体可以看下面的示例
过滤器可以被串联执行（顺序执行）
{ { message | filterA | filterB }}
这个很好理解。
在{ {}}中运行表达式
什么是JavaScript表达式呢，请看下面示例：
{ { number + 1 }}{ { ok ? 'YES' : 'NO' }}{ { message.split('').reverse().join('') }}
它一般表达的是运算关系；如果运算很简单，一次性的，你可以不用filter，而采用这种简短的写法； 注意：{
{}}里只能写单行表达式，不能写多行，更复杂的运算我们后面会介绍解决方案；
单次插值：<span v-once="name">{
{name}}</span> v-once控制只能赋值一次， 更改了那么值 显示的还是 第一次name的值<!DOCTYPE html>
<html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <div id="box" v-once> <!-- 控制数据不变 一直为初始值 --> { {msg}} <div> { {msg}} </div> </div></body><script type="text/javascript" src="js/vue.js"></script><script type="text/javascript"> vu = new Vue({ el:"#box", data:{ msg:"aaaac" } })vu.$data.msg='2323'; 修改值的一种形式//vu.msg="2323" 修改值的另一种形式
</script>
</html>v-bind
<a v-bind:href="url"></a>
这是用来绑定html已有的属性，比如 class, style, src,href等等，url来自data，这样这些属性就变成动态，响应式的了。
v-html
<div v-html="rawHtml"></div>
这个是用来显示带html标签的内容的，例如文章的正文，rawHtml来自data。
v-text
<div v-text="stringText"></div>
把字符串加到div标签中，stringText来自data，这种写法等同于
<div>{ {stringText}}</div>
v-on
<a v-on:click="doSomething">
这个我们已经见过，事件绑定肯定要输入事件参数。
计算属性 computed:
<!DOCTYPE html>
<html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <div id="app"> <p>原来的小数: { { float_number }}</p> <p>计算过的动态属性（整数）: { { int_number }}</p> </div></body><script type="text/javascript" src="js/vue.js"></script><script type="text/javascript"> var vm=new Vue({ el: '#app', data: { float_number: 3433.45 }, computed: { //computed 计算属性 （翻译：计算的）属性名不可改 int_number: function () { //这里定义的int_number不再当做方法使用，而是一个属性， return parseInt(this.float_number); //parseInt(this.float_number)注意这个this，指的就是vm; } }, filters: { //filters属性关键字，filters 是属性属性名不能改 过滤器不过是一个方法， toInt: function (value) { return parseInt(value); } }})</script></html>