1.官网：cn.vuejs.org
Stript标签引入要在head里面
2.挂载点，模板，实例之间关系
<div id="root"> </div> -- >挂载点,挂载点之内的内容，是模板
<script>
new Vue({
el:"#root",
template:'<h1>hello</h1>', 模板可以放在实例里
data:{
msg:"world"
}
})
</script>
3.Vue实例中的数据，事件和方法
<h1>{{number}}<h1/> 插值表达式
<h1 v-text="contect"><h1/>
<div v-html="contect"> </div>二者差别在于，v-text能转义，将标签以字符串方式展现
绑定事件： <div v-on：click=“handleClick”> </div>
handleClick定义在Vue实例的methods里
事件绑定简写：v-on: 可替换成 @
4.Vue中的属性绑定和双向数据绑定
<div v-bind:title="title"></div> title变量指的是实例里的data中title的值
v-bind: 可简写为 ：
双向绑定：<input v-model="contect"/> input 内容改变，实例中的contect内容也跟着改变
5.Vue中的计算属性和侦听器
compute:一个属性由其他属性计算而来。其他属性没改变，该属性用的是缓存值
侦听器：
<div>{{count}}</div>
data：{
count:0
}
watch:{
firstName:function(){
this.count++ 只要firstName的值发生变化，count+1
}
}
6.v-if,v-show,v-for指令
v-if 当他对应的数据项的值是false时，会直接将该标签清除，
v-show 当他对应的数据项的值为false时，将该标签增加display:none 属性
隐藏显示频繁时用v-show性能更好
v-for：
<ul>
<li v-for="item of list" :key="item">{{item}}</li> 使用key提升渲染效率，但要求key值都不同，若item值相同，
可以用index做key值 v-for="（item ，index）of list"
</ul>
data{list:[1,2,3]}
7.组件的拆分及全局组件，局部组件
全局组件↑
局部组件↑
组件的拆分↑
props属性：意为该组件接收从外部传过来的名为content的属性
8.组件与实例的关系
每一个vue的组件就是一个vue实例，每一个组件也可以写method等属性
当小组件被点击时，触发了handelClick方法 ，该方法向外触发一个事件，事件名为delete，事件对应的值为index；由于父组件在创建子组件时，有一个监听事件，当监听到delete方法被触发时，就会执行handelDelete方法，该方法定义在父组件的模板里，为父组件的方法
将list中对应的index下标的值删掉。一旦list发生变化，todo-item会将对应的该组件从列表删掉
总结一下大概的逻辑过程：
（1）：父组件通过prop向子组件传值 子组件获得父组件传来的内容和索引。
（2）：子组件通过$emit向父组件抛出触发事件名称（delete）和触发事件的list索引值。
（3）：父组件通过监听对应事件名称（@delete）触发函数handleDelete。函数通过子组件抛出的索引值对应删除list
vue-cli相关用法：
1.template中只能有有个标签包裹其他所有标签
2.data 不再是一个对象而是一个函数，返回值为对应数据