scssとReactJSとreduxを使用して1ページにCSSを追加

Question

私はreduxでReactJSを使用しています。 私はscssを使用しています。 HTML：：{オーバーフロー：隠さ} http://localhost:3000/login 私はこのページに追加する必要があります。

をし、他のページに私は、この属性を削除したい は私の道があると言うことができます。

誰か手掛かりがありますか？

Answer 1

あなたは、htmlタグのスタイル属性を変更することができますあなたのヘッダーで言うように条件に入れるだけです（すべてのページに要素がなければなりません）。

const isLogin = window.location.pathname === login ? true : falseよう

何か（< =これは本当の条件ではないが、それはそうisLogin真等しい作ることはあなたがあなたのログインページにあります）。

<Header className={ $ {className1} $ {className2} $ {isLogin？ loginStyle： ''} }/>

あなたのスタイルはログインページにのみ適用されます。おそらく最もシンプルではないかもしれませんが、少なくともこれはうまくいくでしょう:)

Answer 2

私はあなたのプロジェクトアーキテクチャがどのようになっているのかわかりませんが、HTMLタグにクラス（className）を別の方法で追加できます。

必要に応じて、還元状​​態を使用することもできます。 Xページに入っているかどうかを確認してください。大丈夫ならブール値をtrueに渡し、それが真であればCSSを入れます。

私は最初の解決策を好む。あなたは、

html: { overflow: hidden; }

を次に：

class MyPage extends React.Component { 

    componentWillMount() { 
    this.htmlTag = document.getElementsByTagName('html')[0]; 
    this.htmlTag.setAttribute('style', 'overflow: hidden'); 
    } 

    componentWillUnmount() { 
    this.htmlTag.setAttribute('style', ''); 
    } 

    ... 
} 

Answer 3

あなただけのはloginStyleを言わせ、クラス名をインポートし、それを作ることができる：