防止CSS影响另一个Vue组件

Question

我有一个项目，首先它只是一个普通的SPA，但后来我必须将另一个Vue项目合并到其中，这会导致css冲突......

现在我有一个这样的路由器：

{
  path: '/admin',
  name: 'Home',
  component: MainContainer,
  redirect: '/admin/posts/list',
  children: .....
},
{
  path: '/',
  component: Container,
  children: .....
}

这意味着我在 1 个 Vue 应用程序中有 2 个系统，但使用不同的 CSS。我的尝试是使用作用域 css 作为主要组件 - 这里是MainContainer和Container。但是使用作用域样式使样式不会影响这些子组件。有没有MainContainer专门供儿童style1.css使用Container的style2.css？如果我删除scoped，样式style1.css也会影响Container等等

MainContainer当页面从=>或反向更改时，我可以检查 vue 路由器并重新加载页面以清理旧的 css Container，但这似乎不是正确的方法。