Vue keep-alive

详细介绍地址：keep-alive详解

keep-alive：vue内置的组件，能在组件切换过程中将状态保存在内存中，防止dom重复渲染
使用场景：
把页面保存在内存中，记住输入的内容
使用方式：

<keep-alive>
	<router-view></router-view>
</keep-alive>

keep-alive：include标签和exclude标签

include:（name） 需要保存状态的组件
exclude: 不需要保存状态的组件

具体使用场景案例：例如在页面中，点击按钮AAAAAA进入A页面，点击按钮BBBBBB进入B页面，再回到A页面的时候，之前A页面输入的内容不丢失

App.Vue

<template>
	<div>
		<router-link to="/a" tag="button">AAAAAA</router-link>
		<router-link to="/b" tag="button">BBBBBB</router-link>
		<keep-alive include="aa,bb">
			<router-view></router-view>
		</keep-alive>
	</div>
</template>

<script>
</script>

<style>
</style>

A.Vue

<template>
	<div>
		这是A组件
		<input type="text">
	</div>
</template>

<script>
	export default{
		name:"aa"
	}
</script>
<style>
</style>

B.Vue

<template>
		<div>这是B组件</div>
</template>

<script>
	export default{
		name:"bb"
	}
</script>

<style>
</style>