一：V-Bind的使用
- 了解动态绑定元素的基本属性(url,herf,class,style等)
- 了解语法糖的使用
二：函数的增强写法
//es5的写法
const obj={
run:funtion(){
//TODO
}
}
//es6的写法
const obj={
run(){
//TODO
}
}
三：V-on的使用(事件监听)
- 了解语法糖的使用
v-on:click="functionName"
语法糖写法：@click="functionName"
- 传递参数
1.元素使用@click挂载带()的函数，并将参数传入()内
2.如果方法本身定义有参数，在元素使用@click挂载这个方法时不带括号只写一个函数名则VUE会默认把浏览器生成的event事件对象作为参数传入方法当中。
- 修饰符 使用@click.stop阻止冒泡。
四：V-model的使用(双向绑定)
重点
五：组件化
- 组件的使用分成三个步骤
- 创建组件构造器对象
const cpnC=Vue.extent({
template:
"<h2></h2>"})
- 在父组件当中注册组件(vue实例也可当成一个组件,不过是根组件)
//全局组件 Vue.component('my-cpnc',cpnC)
//局部组件 new vue({ el:'#app', data:{}, compoenets:{ my-cpnc:cpnC } })
- 使用组件
<my-cpn><my-cpn/>
五：父子组件
const cpnC=Vue.extent({
template:
"<h2></h2><cnp1></cnp1>"Components:{
cnp1:定义好的子组件名
} })
六：组件模板抽离写法
- 写法1
2.写法2
七：组件里的data必须是一个函数
这样做的原因是保证不同的组件实例用的是不同的数据对象
八：父组件给子组件传值
在真实开发当中，Vue实例和子组件的通信和父组件和子组件的通信过程是一样的
通过props来进行传值
- 字符串数组，数组的字符串就是传递的名称
- 对象，对象可以设置传递时的类型，也可以设置默认值等
九：子组件给父组件传值
自定义事件
