最近在用 Vue 开发一个网站，部分页面从主页进入路由，然后再从路由回退到主页，路由页面的样式会残留在主页上，需要刷新主页才能正常。
解决办法
1. 在 Vue 文件的 style 中，使用 scoped
<style scoped>
...
...
</style>
这个可选 scoped 属性会自动添加一个唯一的属性 (比如 data-v-21e5b78) 为组件内 CSS 指定作用域，也就是给你定义的名字前加一串哈希值，编译的时候 .list-container:hover 会被编译成类似 .list-container[data-v-21e5b78]:hover。
2. 使用 src 引入 css 文件
一开始，我在 style 标签上添加 scoped 属性，问题依然没有解决，然后我再通过更改 css 文件的引入方式，最终将问题解决，我使用 src 引入 css 文件，而不是使用 @import 的方式。
<style scoped>
@import "~@scss/xx/xxx";
</style>
一开始使用这种引入方式，问题依然存在，原因是：@import引入的css，会被编译为全局样式。因此如果不同的 css 文件里面取用的类名相同的话，很可能会造成样式的错误调用。
<style src="./css/xxx.css">
...
...
</style>
通过这个方式，问题解决了。
