- activated:页面第一次进入的时候,钩子触发的顺序是created->mounted->activated
- deactivated :页面退出的时候会触发deactivated,当再次前进或者后退的时候只触发activated
keep-alive简介:
keep-alive是vue内置的一个组件,可以被包含的组件保留状态,或避免重新渲染。
// 如果只想router-view里面某个组件被缓存的话,可以给他增加router.meta属性
<keep-alive >
// 该组件将被缓存 通过meta.keepAlive == true 判断
<router-view class="router-view" v-if="$route.meta.keepAlive" />
</keep-alive>
// 该组件不被缓存 通过meta.keepAlive == false 判断
<router-view class="router-view" v-if="!$route.meta.keepAlive" />
// router中的配置
// 新增订单列表
{
path: "/order/orderList/orderList",
name: "orderLists",
// 该组件将被缓存
meta: {
keepAlive: true,
},
component: () => import("@src/views/order/orderList/orderLists"),
},
// 车险列表-电子发票客户授权
{
path: "/order/orderList/electronicInvoice",
name: "orderList",
// 该组件不被缓存
component: () => import("@src/views/order/orderList/electronicInvoice"),
},