持续创作,加速成长!这是我参与「掘金日新计划 · 10 月更文挑战」的第4天,点击查看活动详情
一。Vue组件之间的通信方式都有哪些
- 通过 props 传递 (父传给子)
- 通过 $emit 触发自定义事件 (子传给父)
- 使用
$refs$children(父组件获取子组件实例) - 使用
$parent(子组件获取父组件实例) - 使用
$root(子组件获取根组件实例) - EventBus 中央事件总·线 (用于兄弟组件之前通信)
- provide 与 Inject (祖孙组件之间通信)
$attrs与$listeners(祖孙组件之间通信)- Vuex (全局状态管理)
二。双向数据绑定是什么
双向绑定:数据变化后更新视图,视图变化后更新数据。
实现方式:
- 监听器(Observer):对所有数据的属性进行监听(利用Object.defineProperty里面的set方法,劫持监听所有的属性)
- 解析器(Compiler):对每个元素节点的指令进行扫描跟解析,根据指令模板替换数据,以及绑定相应的更新函数
三。Vue中的$nextTick有什么作用
在Vue中数据更新后,会重新渲染DOM,渲染DOM是需要时间的。
如果数据更新后,需要对DOM结构进行手动调整,这个时候就可以使用$nextTick,因为它里面定义的代码会在DOM更新完成后再执行。
四。说说你对vue的mixin的理解
mixin 用于对vue进行混入,包括全局混入和局部混入。
如果项目中所有的vue实例或者组件,都具有相同的一组数据,方法,计算属性,侦听器,生命周期函数
就可以通过全局混入的方式,统一定义这些成员,这样的话,所有的vue实例就不需要分别定义这些成员了
比如:每个vue实例都要有发送器请求的方法,就可以将请求方法全局混入,this.get,this.post
五。说说你对slot的理解?
插槽就是给组件的使用者,更多的定制化空间。
比如:一个表格组件,主要的功能是展示列表数据,可以通过插槽的方式定制表格的编辑按钮。
分类:
- 默认插槽 (直接通过slot内置组件定义)
- 具名插槽 (通过多个slot内置组件定义,需要设置不同的name属性值,在使用时必须要通过template内置组件的v-slot:name的方式指定)
- 作用域插槽 (必须定义成具名插槽,可以同插槽传递一个数据出去,让插槽的使用者通过这份数据定制更多的功能)