vue 代码都是从这段开始
new Vue({})
大括号内的属性就是渲染页面的来源
1.el 属性
应该就是 elemet ，表示 html 的标签元素，id(#idName)、class(.className)、标签(div) 都有效，这里的用法和 jquery 没有区别，用途就是告诉 vue 要渲染的对象是谁
2.data 属性
就是字面上的意思传数据的，比如 data 下有一个{ msg: ‘star‘ } 的属性，页面有一个 {{ msg }} 代码，那么渲染的时候，vue 会自动从 data 中找到 msg 属性来替换 {{ msg }} ，打开的页面就会显示 star 了
3.methods 方法
自定义方法，写过 js、jquery 的都经常用回调函数 vue 也不例外，比如 methods 中定义了一个 { onefun: function(){ this.msg = ‘success‘; } } 的回调函数，页面上有一个按钮，通过 v-on:click="onefun" 绑定我们自定义的回调函数，这个按钮点击就会触发我们写的这个方法了，前面我们页面上显示的 star 就会变成 success ，这是 vue 的一个特点，自动更新渲染
3.filters 过滤器
本质上就是前面的 methods 的专用版，写法一样。一般用于对展示的数据做一些自定义的处理，比如前面示例中的 {{ msg }} 改成 {{ msg | bigbig }}，然后在 filters 中定义一个叫 bigbig: function(v){ return v.toString().toUpperCase(); } 的函数，那么页面显示的时候就不会是 star 而是 STAR 。过滤器可以同时绑定多个，除了默认传的值以外，还可以像正常调用 js 方法一样，传其他参数，或者回调函数
3.在 html 标签元素中动态绑定，在绑定中我们依然可以通过加上 |过滤器方法名 的方式为绑定内容进行处理
1.<a>元素的 v-bind:href 通常用简写 :href 动态绑定跳转链接
2. v-on:click 通常用简写 @click 动态绑定点击事件，v-on 可以给html现有的事件绑定方法，同时还有一些更详细用法可以查看官方文档
3. v-bind:id 为标签元素的属性动态绑定值，不止 id 属性，什么 class、style、标签元素有的属性都能绑
4. v-html 将动态绑定值以html格式展示，比如我前面的 msg 属性值现在是 ‘<p>这是演示代码</p>‘，给一个 div 标签绑定 v-html:msg ,那么页面html代码会展示<div><p>这是演示代码</p></div>
5. v-model 双向绑定，通常用于表单标签，比如 input、select、textarea、checkbox、radio 这些，可以绑定 data 中的属性，当用户进行操作的时候，进行改变的值进行重新渲染，比如场景：左边用户输入内容，右边预览对实际显示效果进行实时渲染。
6. v-if 通过判断，决定是否对这个标签进行渲染输出，当然它也有配套的 v-else、v-else-if 。v-if 的条件和正常写 js 一样，但不能使用 filters，但是可以使用 methods
7. v-show 和 jquery 的 .show()、.hide()有点像，通过 绑定的值或方法返回值 是 true 或 false 来控制标签的显示隐藏
8. v-for ，可以遍历 array ，可以遍历 object 属性，还可以遍历整数！
v-for="site in sites"，通过遍历 data 中 sites 集合，然后就可以通过 {{ site.属性名 }} 来输出值了。
v-for="site in sites"，通过遍历 data 中 sites 对象，然后就可以通过 {{ site }} 来输出 sites 对象的所有属性的值了。
v-for="(value, key, index) in sites"，通过遍历 data 中 sites 对象，然后就可以通过 {{ value }} {{ key }} {{ index }} 对象的所有属性信息了。ps：index 是可选的参数
v-for="n in 10"，通过整数，然后就可以通过 {{ n }} 输出 1-10 十个整数
通过 {{ msg }} 我们就可以把 data 中的 msg 的值 输出到页面上，但 {{ }} 并不只是这么简单，我们可以把他看成一个可编译块，我们在里面甚至可以直接写一个 function ，所有 vue2 是真的好难。