Feature request: remove the global style of last page when navigate to a new page when using vue-router.

[huyaxiong]

For instance I have codes like this:

router.js

import Vue from 'vue';
import VueRouter from 'vue-router';
const A = resolve => require(['./component/a.vue'], resolve);
const B = resolve => require(['./component/b.vue'], resolve);

Vue.use(VueRouter);

const routes = [
    {
        path: '/a', component: A,
    },
    {
        path: '/b', component: B,
    },
];

let router = new VueRouter({routes});
export default router;

a.vue

<style lang="sass">

body {
    background-color: #1F2C36;
}

</style>

When I navigate to the route /a first, And then I navigate to the route /b, the background color doesn't change, What I want is that the global style defined in a.vue should be removed when I navigated to another page.And I read all the document seems that there were no solution for this.

[posva]

That relies on vue-loader and looks counter intuitive. There's no reason for styles to be removed.
What you could do it define CSS classes and apply/remove them using the component life cycle (beforeCreate, beforeDestroy)

[mshamaseen]

I think it is intuitive to be automatically removed.
When a global style is defined inside a component\page rather than a global stylesheet, it is because the dev probably wants to apply that style only on that page.