前言

正文页的特点是：

1. query里有id
2. 在正文页可以切换其他正文页
3. 也可以先跳走再跳回正文页且id不变
4. 也可以先跳走再跳回正文页且id变

假定

假定正文页的内容几乎不变，也就是不会有频繁的内容变化，或者，尽管有频繁的变化，但是所有的变化只可能是访问者本人导致。

如果不符合这个假定，那么正文页就没有必要设置keep-alive。

办法

1. 由于onMounted无论本页是否是着陆页，都会触发一次且只触发一次，所以这里执行fetchAllDataOfPage
2. 之后由watch接管逻辑（由于keep-alive，本watch始终有效）：
3. route.name !== '路由名'负责只监听跳入的情况
4. newVal.id === queryId.value负责只监听id有变化的情况，这个queryId是把当前id存起来，供下次用

代码

onMounted(() => {
  fetchAllDataOfPage()
  watch(
    () => route.query,
    (newVal) => {
      if (route.name !== '路由名字' || newVal.id === queryId.value) return
      queryId.value = newVal.id
      fetchAllDataOfPage()
    }
  )
})

为什么不用onActivated

1. 正文页互跳时只切换id，这时不触发onActivated
2. 正文页作为着陆页的时候首次进入不触发onActivated，不是着陆页的时候首次进入触发onActivated，逻辑复杂