前言：Vue.js使用基于HTML的模版语法，允许开发者声明式绑地将DOM绑定至底层Vue实例的数据。
Vue.js的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进DOM的系统。
结合响应系统，在应用状态改变时，Vue能够智能地计算出重新渲染组件的最小代价并应用到DOM操作上。
一、生命周期
比较常用的生命周期钩子有
二、插值与表达式
1、文本插值
使用双大括号（"{{}}"）是基本的文本插值语法，它会自动将双向绑定数据实时显示出来
<div id="app">
<h1>{{message}}</h1>
</div>
<script type="text/javascript">
var app = new Vue({
el:‘#app‘,
data:{
message:‘Hello World!‘
}
})
</script>
大括号里的内容会被替换为Hello World!，通过任何方法修改数据 message ，大括号的内容都会被实时替换
2、输出HTML，可以使用v-html
<div id="app">
<span v-html="link"></span>
</div>
<script type="text/javascript">
var app = new Vue({
el: ‘#app‘,
data: {
link: ‘<a href="#">这是一个链接</a>‘
}
})
</script>
link的内容会被渲染成一个可点击的a标签而不是纯文本
在{{}}中，除了简单的绑定属性值外，还可以进行简单的运算、三元运算等。如：
<div id="app">
<h4>{{number/10}}</h4>
<h4>{{isOK ? ‘确定‘: ‘取消‘}}</h4>
<h4>{{text.split(‘,‘).reverse().join(‘,‘)}}</h4>
</div>
<script type="text/javascript">
var app = new Vue({
el: ‘#app‘,
data: {
number: 80,
isOK:false,
text:‘1,2,3,4,5‘
}
})
</script>
输出的结果依此为8，取消，5,4,3,2,1
原文：https://www.cnblogs.com/HeLingping/p/14545549.html