2021-7-16 山东大学软件学院暑期项目实训日志-第三周 03

目录

1.VUE事件

2.特殊特性

3.选项 / 数据

4.生命周期

---

1.VUE事件

•V-on：监听事件

•自定义事件

组件内抛出：this.$emit('myEvent')

外部监听：<my-component v-on:myEvent="doSomething"></my-component>

•将原生事件绑定到组件

<base-input v-on:focus.native="onFocus"></base-input>

2.特殊特性

•Key：有相同父元素的子元素必须有独特的 key，主要用在v-for

•Ref：<input ref="input">被用来给元素或子组件注册引用信息

•Slot：用于标记往哪个具名插槽中插入子组件内容

3.选项 / 数据

•Data： Vue 实例的数据对象

•Props： props 可以是数组或对象，用于接收来自父组件的数据

•Computed：计算属性的结果会被缓存，除非依赖的响应式属性变化才会重新计算

•Watch：一个对象，键是需要观察的表达式，值是对应回调函数

•Methods：放置普通函数的地方

4.生命周期

 

 

beforeCreate：此时data、method和$el均没有初始化

created：此时data和method初始化完成，但是DOM节点并没有挂载

beforeMount：编译模板，并且将此时在el上挂载一个虚拟的DOM节点

mounted：编译模板，且将真实的DOM节点挂载在el上，可做数据请求

beforeUpdate：在数据有更新时，进入此钩子函数，虚拟DOM被重新创建

updated：数据更新完成时，进入此钩子函数

beforeDestory：组件销毁前调用，移除watchers、子组件和事件等 

destoryed：组件销毁后调用
 

参考自：https://blog.csdn.net/lcgoing/article/details/84993636