vue 单独页面body css 设置如何设置！

Question

我在全局引入了一个css

import './assets/base.css'

所有页面的设置都是按照这个base.css里设置好的背景色。
但是我某个页面不想要这个背景。我想更改它，我却怎么弄都没有改到！

login.vue

<style>
    body {
        background-color: red;
    }
</style>
<template>
    <div>
        324231
    </div>
</template>

<script>
    export default{
        data(){
            return{
                msg:'hello vue'
            }
        }
    }
</script>

我想在这个login.vue 页面的背景是红色 而不是我全局里设置的蓝色！ 请问下怎么设置更改呢？？？？

Answer 1

在created中用js添加样式
在beforDestory钩子中用js移除样式

Answer 2

每个vue页面可以单独添加一个容器div .container{position:absolute;width:100%;height:100%;top:0;left:0;overflow-y:auto;background-color:#dddddd} ----这个类就来控制背景色 当然也可以监听路由 用钩子改变body样式 也可以每个页面的生命周期添加修改body样式

Answer 3

你在单独页面加一个全屏div，然后覆盖掉body的背景色就可以了