想要实现页面的局部刷新，我们只需要实现局部组件（dom）的重新渲染。在vue中，想要实现这一效果最简便的方式方法就是使用v-if 指令。
在Vue2中我们除了使用v-if 指令让局部dom的重新渲染，也可以新建一个空白组件，需要刷新局部页面时跳转至这个空白组件页面，然后在空白组件内的beforeRouteEnter 守卫中又跳转回原来的页面。
如何在Vue3.X中实现点击刷新按钮重新加载红框内的DOM，并显示相应的加载状态？。
立即学习“前端免费学习笔记（深入）”；
由于Vue3.X中script setup 语法中组件内守卫只有onBeforeRouteUpdate 及onBeforeRouteUpdate 两个API，因此我们来借助v-if 指令使局部dom重新渲染来实现这一需求。
第一步：定义状态标识
在全局状态中定义一个isRouterAlive 标识刷新状态，根据isRouterAlive 变化来重新渲染。isLoading 标识加载状态。
import { defineStore } from 'pinia'
export const useAppStore = defineStore({
id: 'app',
state: () =>
({
isRouterAlive: true,
isLoading: false
} as { isRouterAlive: boolean; isLoading: boolean })
})第二步、借用v-if 指令让dom节点重新渲染
Footer
第三步、修改isRouterAlive 值，实现dom的重新渲染
