主要使用：vue 官方文档
basis
- 声明式渲染
特点：响应式（reactive）,在控制台改变参数的值，会同时更新在页面上,唯一例外是使用Object.freeze(),阻止响应追踪 - 条件与循环
指令：v-if,v-for - 处理用户输入
指令：v-on（事件监听器） , 如：v-on:click="oneMethod" - 组件化应用构建
对此概念理解不深
尽管这只是一个刻意设计的例子，但是我们已经设法将应用分割成了两个更小的单元。子单元通过 prop 接口与父单元进行了良好的解耦。我们现在可以进一步改进 <todo-item> 组件，提供更为复杂的模板和逻辑，而不会影响到父单元。
######### 官方文档示例代码-HTML
<div id="app-7">
<ol>
<!--
现在我们为每个 todo-item 提供 todo 对象
todo 对象是变量，即其内容可以是动态的。
我们也需要为每个组件提供一个“key”，稍后再
作详细解释。
-->
<todo-item
v-for="item in groceryList"
v-bind:todo="item"
v-bind:key="item.id">
</todo-item>
</ol>
</div>
######### 示例代码-JS
Vue.component('todo-item', {
props: ['todo'],
template: '<li>{{ todo.text }}</li>'
})
var app7 = new Vue({
el: '#app-7',
data: {
groceryList: [
{ id: 0, text: '蔬菜' },
{ id: 1, text: '奶酪' },
{ id: 2, text: '随便其它什么人吃的东西' }
]
}
})
数据与方法
vue示例创建后，会暴露出数据属性，实例属性，方法。实例生命周期钩子
钩子：created,mounted,updated,destroyed
作用：在不同阶段添加自己的代码-
生命周期图示
Vue Lifecycle
template syntax
watch out
- 深拷贝： vue中，若多个组件引用了同一对象作为数据，当其中一个组件改动对象数据时，其他对象也会同步改动。有双向的绑定的需要最好，但需要各组件的对象数据之间相互独立时，解决办法如下：
computed: {
data: function () {
var obj={};
obj=JSON.parse(JSON.stringify(this.templateData)); //this.templateData是父组件传递的对象
return obj
}
}
- 深拷贝与浅拷贝的异同（JS为例）：
shallow copy:仅指向被复制的内存地址，拷贝的值为引用，改变一个的值，会影响另一个。
deep copy:值拷贝，开辟新的内存地址存放复制的值，各自独立。在js中，数组和对象的复制如果使用=号来进行复制，那只是浅拷贝。Javascript中基本数据类型变量的相互赋值是使用深拷贝执行的。
转：深拷贝方法对比 : javascript 数组以及对象的深拷贝（复制数组或复制对象）的方法
