fix: 兼容transition使用在无根元素组件时路由切换失败的问题

[huohuoit]

问题：在协作开发时，可能有些组件没有根元素，Vue3 支持但 transition 不支持，这时候在页面切换的时候可能出现页面（appMain相关代码部分）空白的情况，路由无法正常跳转。 兼容办法：用一个div包裹transition的插槽组件component，并通过key绑定路由的路径。

:key=“route.fullPath”写在component上好像不生效，这里删除了，同时把class换成了Tailwind CSS写法

[xiaoxian521]

类名无需修改 请还原一下

[lyf3358]

视图组件修改了 script 代码，hmr更新后，切换路由页面空白，使用 @huohuoit 提供的方法确实有效，希望 作者 @xiaoxian521 排查下

[xiaoxian521]

经测试该方法行不通，会造成页面缓存失效 对于这个问题文档已经做出解决方案了，请多看文档 @lyf3358 文档地址

[lyf3358]

经测试该方法行不通，会造成页面缓存失效

对于这个问题文档已经做出解决方案了，请多看文档 @lyf3358

文档地址

经过多个项目测试，只要使用transition 并绑定mode属性 + keep-alive缓存，hmr热更新后，切换路由都会出现页面空白的问题，暂不清楚什么原理，暂时只能二选一。很感谢作者抽空排查此问题🤝