vuecli 3.0页面样式加了scoped 竟然影响其他路由页面样式

KenOscar
  • 848

都知道想要vue路由的页面私有化,不受其他页面的影响,也不影响其他页面 加一个scoped就可以

今天我却遇到了这个情况

login.vue

`
<style lang="less">
body {
margin: 0;
padding: 0;
// min-width: 1280px;
height: 100%;
background-image: url(images/login_bg.jpg);
background-size: 100% 100%;
background-repeat: no-repeat;
box-sizing: border-box;
`

页面含有背景图片

等到跳转到了 b.vue 页面样式为空
`
<style lang='less'>
</style>
`

但是b页面却 带有跟login.vue一样的背景图片
我给b页面 加了 scoped 也同样跟login.vue 有一样的背景图片

我给Login.vue 加了scoped之后 背景图片消失了~~~~ 竟然成了纯白的了

感觉交错了 请问问题出在哪里 之前都是这样写的 没有问题 这是头一次出现这个问题

回复
阅读 2.1k
2 个回答

scoped后,不要使用body,因为编译后是这样的:

body[data-v-7ba5bd90] {
  
}

所以不会生效。

<style lang="less" scoped> 标签

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏