私は非常に最近React & Reduxエコシステムに参加しました。 Reactが提供するコンポーネント(さらに多くのことを含む)とReduxの3つの原則の間のきれいな組織に感謝します。私は開発する最良の方法が何であるかを決めるのが難しいと思っています。オブジェクト指向または機能性?React/Reduxの開発はオブジェクト指向プログラミングかFunctional Programmingか?
React/Reduxの前は、以前はES6クラスを使用して開発していましたが、これはオブジェクト指向プログラミング、特に継承のためのきちんとした構文を提供します。以下のような簡単な構造の上に構築されたすべてのコンポーネントのクラス:Reduxのの導入後
export default class MyComponent extends React.Component {
constructor(){
// initialise state here
}
componentWillMount(){
// populate state here
}
componentDidMount(){
// update UI/bind listeners here
}
render(){
// output HTML here
}
}
は、私は上記の構造は、コンポーネントは、もはや自分自身の状態を維持しているので、私は後だんどのような状態ではなくなったことを感じるようになりました;代わりに状態はReduxストアから来て、connect
メソッドとmapStateToProps
を使用して小道具として渡されます。不変データのコンセプトとともに、これはすべての関数がファーストクラスの関数である関数型プログラミングアプローチを支持するように思われました。上記のコンポーネントは、今のように見えるを開始します:
const MyComponent = ({ myPropA, onEvent }) => {
// output HTML here
}
const mapStateToProps = state => {
return {
myPropA: state.myPropA
}
}
const mapDispatchToProps = dispatch => {
return {
onEvent: data => dispatch({
type: 'ACTION_NAME',
data
});
}
}
connect(mapStateToProps, mapDispatchToProps)(MyComponent);
関数型プログラミングのアプローチをより良いリアクト/ Reduxの組み合わせを好むようだ、しかし私は助けるが、いくつかの有用なOOPはを逃しされていることを感じることができません。 React/Reduxテクノロジスタックに関するベストプラクティスは何ですか?誰もが違うことをしているようです。しかし、推奨やベストプラクティスはありますか?コンテナ(スマート)はクラスコンポーネントである一方、プレゼンテーション(ダム)コンポーネントは機能コンポーネントであると言うのは賢明でしょうか?または、コンポーネントライフサイクルが必要なときはいつでもクラスでなければなりませんが、それ以外の場合は機能コンポーネントですか?
OOPとFPは広いトピックであることを認識しています。 React/Reduxの範囲内で、私は単一の正解があることを望んでいます。 :)
にこれらの説明を見つけることができますか?これは実際には有効な質問です! AngularとRedux(後でngrx)を使って作業するとき、私はこれを自分自身に尋ねました。 – tftd
本当にあなたのコンポーネントで何をしたいかによって異なります。現時点では、リアクションコンポーネントは必要に応じてより強力になる可能性があります(ライフサイクルイベントを利用できるように) – Icepickle
意見に基づいていると私は同意しません。もちろん、開発者は両方をやっているかもしれませんが、正しいか悪いか、良いか良いかがあるはずです。開発者の選択の背後に理由がなければならない。 Javaのようなより伝統的なプログラミング言語では、1つのデザインパターンを別のデザインパターンに使用すべきかどうかについて議論することができます。 –