質問: ``` ReactDOM.render( , document.querySelector('#header') ); ReactDOM.render( , document.querySelector('#content') ); ``` このようにすると、#contentがないページなどではエラーが出たため、以下のように変更 ``` if (document.getElementById("header") != null) { ReactDOM.render( , document.querySelector('#header') ); }; if (document.getElementById("content") != null) { ReactDOM.render( , document.querySelector('#content') ); }; ``` このようにするとProviderが複数個できてしまうので、Providerの中をIDごとに出し分けたいです。 ご教授いただけるとありがたいです、よろしくお願いします。
回答: やったことなので、わかりませんが、 https://github.com/reduxjs/react-redux/issues/355 この辺を参考にすると良さそうな気がします。 ただ、基本reactはnestして展開していくライブラリです。 複数にすることによる弊害などもあるかと思います。例えば、contentのcontextをheaderが見れないなど。 `#app`にしてシングルマウントにしたほうが後々詰まることが少ない気がします。 自分はRailsでReactを使う場合は、 ・storeを使わないで、常にrailsのviewからpropsを渡す もしくは ・railsのviewを使わない(layoutのみ)でspaにしてしまう という感じでやっています。そのほうが責務が混在しなくてやりやすいのと、詰まったときに解決しやすいので。 参考になれば幸いです