Vue.js笔记
1引入 Vue
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
或者：
<!-- 生产环境版本，优化了尺寸和速度 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
或者内部引入
<script src="vue.js"></script>
2声明式地将数据渲染进 DOM 的系统：
<div id="app">
{ { message }}
</div>
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
3、
4、将这个元素节点的 title attribute 和 Vue 实例的 message property 保持一致
5、指令的职责是，当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM。
v-if指令:可以把数据绑定到 DOM 文本或 attribute，还可以绑定到 DOM结构。此外，Vue 也提供一个强大的过渡效果系统，可以在 Vue 插入/更新/移除元素时自动应用过渡效果
指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染
v-for 指令:可以绑定数组的数据来渲染一个项目列表：
指令基于一个数组来渲染一个列表。v-for 指令需要使用 item in items 形式的特殊语法。
items 源数据数组，
item 被迭代的数组元素的别名。
item ,index in items 其中的index表示数组的索引。
举例：v-for="(value, name, index) in object"第一个参数是property，第二个参数是 property 名称 (也就是键名)，第三个参数作为索引
v-on 指令: 监听 DOM 事件，并在触发时运行一些 JavaScript 代码。添加一个事件监听器，用于监听 DOM 事件，通过它调用在 Vue 实例中定义的方法。
v-bind 指令用于响应式地更新 HTML attribute，也就是属性
绑定 HTML Class v-bind:class
传给 v-bind:class 一个对象，以动态地切换 class
把一个数组传给 v-bind:class，以应用一个 class 列表
绑定内联样式v-bind:style
直接绑定到一个样式对象
可以将多个样式对象应用到同一个元素上
可以为 style 绑定中的 property 提供一个包含多个值的数组，常用于提供多个带前缀的值，
v-model 指令在表单 <input>、<textarea> 及 <select> 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。
6、插值：
7、组件：是可复用的 Vue 实例，且带有一个名字。把组件作为自定义元素来使用