文章/答案/技术大牛

发布

社区首页 >问答首页 >最后导入的样式仍然存在于下一个React路由中

问最后导入的样式仍然存在于下一个React路由中
EN

Stack Overflow用户

提问于 2018-04-03 14:37:21

回答 1查看 21关注 0票数 0

所以我使用React，webpack-serve和less-loader，我有两个非常简单的页面，它们加载了一个不同风格的文件：

import React from 'react';
import { withRouter } from 'react-router-dom';

import 'less/index.less';

class IndexPage extends React.Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (<div>qqwdqddddeeewd</div>)
    }
};

export default withRouter(IndexPage);

这两个页面都导入了不同的less文件，但是当从第一页切换到第二页时，第一页的样式仍然保留在第二页中。( import将在页面中创建一个<style></style> )

我能做些什么来避免这种情况呢？如何让第二页只有它的导入样式？

reactjs

react-router

webpack-dev-server

回答 1

Stack Overflow用户

发布于 2018-04-03 16:46:29

您可以使用内联样式https://reactjs.org/docs/faq-styling.html。然而，根据React Doc CSS classes are generally more efficient than inline styles.

因此，您可以在每个组件的包装器中使用嵌套和样式。

class IndexPage extends React.Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (<div id="index">qqwdqddddeeewd</div>)
    }
};

然后在你的index.less中

#index {
// style here for index page elements
}

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/49623695

复制

相似问题

问最后导入的样式仍然存在于下一个React路由中
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问最后导入的样式仍然存在于下一个React路由中EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问最后导入的样式仍然存在于下一个React路由中
EN