扫码关注公众号
Vue 组件间通信有哪几种方式?
Vue组件间通信是面试常考的知识点之一,这题有点类似于开放题,你回答出越多方法当然越加分,表明你对Vue掌握的越熟练。Vue组件间3类通信:父子组件通信、隔代组件通信、兄弟组件通信。(1)props/$emit适用父子组件通信(2)ref与children适用父子组件通信(3)EventBus(on)适用于父子、隔代、兄弟组件通信(4)listeners适用于隔代组件通信(5)provide/inject适用于隔代组件通信(6)Vuex适用于父子、隔代、兄弟组件通信
Vue虚拟DOM的实现原理
虚拟DOM就是使用js的object模拟真实的dom,当状态发生变化,更新之前做diff,达到最少操作dom的效果。虚拟DOM旨在避免不必要的DOM操作。Vue中的虚拟DOM做了什么:1.提供与真实dom节点对应的虚拟节点vnode2.状态发生变化时,对比新旧两个vnode,更新视图。vnode类型有:注释节点文本节点元素节点组件节点函数式组件克隆节点;只有三种类型的节点会被创建并插入到DOM中:元素、文本、注释。
v-model的实现原理
v-model双向绑定实际上做了两步动作:1、绑定数据value2、触发输入事件input;也就是说,v-model等同于:<template><divid="app">{{username}}<br/><inputtype="text":value="username"@input="username=$event.target.value"></div></template><script>exportdefault{name:'App',data(){return{username:''}}}</script>
Vue2和Vue3的区别
一、vue2和vue3双向数据绑定原理发生了改变vue2的双向数据绑定是利用ES5的一个APIObject.definePropert()对数据进行劫持结合发布订阅模式的方式来实现的。vue3中使用了es6的ProxyAPI对数据代理。二、Vue3支持碎片(Fragments)就是说在组件可以拥有多个根节点。三、生命周期钩子不同—LifecyleHooksVue2--------------vue3beforeCreate->setup()created->setup()beforeMount->onBeforeMountmounted->onMountedbeforeUpdate->onBeforeUpdateupdated->onUpdatedbeforeDestroy->onBeforeUnmountdestroyed->onUnmountedactivated->onActivateddeactivated->onDeactivated四、父子传参不同五、vue3新增了Teleport瞬移组件