Vue-router切换组件时，如何避免组件被销毁？

本文共计1302个文字，预计阅读时间需要6分钟。

目录 + Vue Router 切换组件时防止组件销毁 + 1. 使用 keep-alive 包裹 router-view + 2. 定义路由 meta 字段 + 3. keep-alive 原理 + Vue Router 路由切换 + 组件重用问题 + 问题描述 + 翻车现场再现实 + 车祸原因分析 + 前因后果

目录

• vue-router切换组件时使组件不销毁
• 1、用keep-alive包裹router-view
• 2、定义路由meta字段
• 3、keep-alive的原理
• vue-router路由切换 组件重用挖下的坑
• 问题描述
• 翻车现场再现
• 车祸原因分析
• 前往救援
• 一次真的救援

vue-router切换组件时使组件不销毁

默认地，使用vue-router切换组件时，离开的组件会被销毁，新进入地组件会创建。

那么，有时候，我们希望离开的组件不要被销毁。这时就需要使用到keep-alive标签来缓存组件。