赞
踩
监听属性用于监视 Vue 实例上的数据变化,并在数据变化时执行一些自定义的操作。当需要在数据发生变化时执行异步或复杂的操作时,通常会使用监听属性。监听属性是一个对象,其属性是要监听的数据,值是一个函数,用于处理数据变化时的逻辑。
计算属性用于基于已有的数据衍生出新的数据,并且只有在相关依赖发生改变时才会重新计算。计算属性是一个函数,在 Vue 实例中使用 computed 选项来定义。计算属性会缓存计算结果,只有在相关依赖发生改变时才会重新计算,并且在多次访问时只会计算一次。
区别如下:
导航守卫是一组用于控制路由导航的钩子函数,允许您在路由发生变化时执行一些逻辑。Vue Router 提供了多种导航守卫,包括全局导航守卫、路由独享的守卫和组件内的守卫。
Vue Router 中常用的导航守卫:
v-if值为false时,会销毁元素,而v-show则仅是通过display来控制元素的显示和隐藏。
v-if 适用于需要对性能进行优化的场景,因为它可以避免不必要的 DOM 渲染和事件监听;v-show适用于对性能要求不高,但需要频繁切换显示和隐藏的场景。
在使用 v-for 指令对数组或对象进行循环渲染时,通常需要为每个遍历的元素添加一个唯一的 key 属性。这是因为 Vue.js 在进行列表渲染时,会尽可能地高效更新 DOM,以减少不必要的 DOM 操作。而使用 key 属性可以帮助 Vue.js 进行有效的列表渲染和更新。
<keep-alive> 是 Vue.js 提供的一个抽象组件,用于将动态组件缓存到内存中,以便在组件切换时保留其状态或避免重新渲染。当一个包裹在 <keep-alive> 内的动态组件被切换时,其状态将被保留,而不会被销毁和重新创建,以提高性能和用户体验。
生命周期:
EventBus(事件总线)是一种设计模式,用于在应用程序的不同组件之间进行通信。它允许组件在不直接相互引用的情况下进行通信,从而提高了组件之间的解耦性。
在 Vue.js 中,EventBus 是一个 Vue 实例,可以用于在组件之间发送和接收事件。通常情况下,我们可以通过在 Vue 原型上添加一个新的 Vue 实例来创建 EventBus,然后在组件中通过该实例来发送和监听事件。
beforeUnmount (Vue 2.x) / beforeUnmount (Vue 3.x): 在卸载组件之前调用。
要自定义钩子,您可以使用 Vue.mixin() 方法或编写全局插件。例如,使用 mixin 可以这样自定义一个钩子:
- Vue.mixin({
- created: function () {
- // 任意自定义逻辑
- console.log('Custom created hook');
- }
- });
在 Vue 中,Mixin 是一种可复用的组件选项对象。它允许您在多个组件中共享和重用代码,从而实现代码的复用和组件的扩展。Mixin 提供了一种在组件之间共享代码的方式,可以将一些通用的逻辑、数据和方法提取到 Mixin 中,然后将其混入到需要的组件中。
Mixin 可以包含组件选项对象中的任何选项,包括 data、methods、computed、watch、生命周期钩子等。
优势:
哈希模式(Hash Mode):
历史模式(History Mode):
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。