2017-09-25 13 views
0

は、propType定義をすべてのプロットロジックまたはプロペラが実際に使用されるプレゼンターのあるコンテナに配置する方が良いのだろうかと思っていました。私は両方の議論を見ることができます。PropTypeの場所のReduxのベストプラクティス

コンテナでは、すべてのプロロジックを1か所で追跡できます。 プレゼンターでは、それらが正しく使用されることを確認します。

ありがとうございます。明確にするために

更新

例えば、container.js

import PropTypes from 'prop-types'; 
import { connect } from 'react-redux'; 

import ButtonPresenter from './some/file'; 

const mapStateToProps = (store, props) => { 
    return ({ 
    example: Number(5), 
    }); 
}; 

const mapDispatchToProps = (dispatch, props) => ({ 
    onClick: id => { console.log(id) }, 
}); 

ButtonPresenter.propTypes = { 
    onClick: PropTypes.func.isRequired, 
    example: PropTypes.number.isRequired, 
} 

const ButtonContainer = connect(mapStateToProps, mapDispatchToProps)(BoxPresenter); 

export default ButtonContainer; 

プロ

すべてのロジックは

2つの異なる容器がプレゼンターで働くことができる1つの位置にあります

短所

プレゼンターが1で記述されたマップ

例えば、presenter.js

import React from 'react'; 
import PropTypes from 'prop-types'; 

const ButtonPresenter = ({example, onClick}) => { 
    return (
    <button onClick={onClick}>{example}</button> 
); 
}; 

ButtonPresenter.propTypes = { 
    onClick: PropTypes.func.isRequired, 
    example: PropTypes.number.isRequired, 
} 

export default ButtonPresenter; 

プロ

propTypesためだけ容器アレイによって知られていないタイプを必要とするかもしれませんプレゼンターを使用してすべてのための場所

短所

ないようflexable、propTypesはロジックとして見ることができ、その後ロジックは、コンテナおよびプレゼンター

答えて

0

の両方である私は、あなたの質問に再来とPropTypesとの関係が表示されません。

とにかく、再利用/消費される可能性が高いReactコンポーネントにはPropTypesを指定します。私は何かが欠けているだけで私の知る限りされる可能性があります
:それは[編集済み]これは

かかわらベースの意見かもしれない店

にバインドされている最高のコンポーネントでそれを行うために私には意味がありません。ルートコンポーネント(階層の上位)をストアにバインドする必要があります。だから私はあなたがどこでそれを消費し、それに財産を渡すのか見ていない。要約すると、2番目のスニペットだけがわかります。コンポーネントのAPIはファイル内に自己完結しており、契約を明確にしています。 eiffel.com/values/design-by-contract

+0

私はreduxを追加しました。実際のコンポーネントはコンテナとプレゼンターの間で分割されています。私はこれがおそらく意見の問題だと思っていますが、 "コミュニティ"がどのように傾いているのかを見極めようとしています – user3243555

+0

私は何かが足りないかもしれませんが、ルートコンポーネント(階層の上位)だから私はあなたがどこでそれを消費し、それに財産を渡すのか見ていない。要約すると、2番目のスニペットだけがわかります。コンポーネントのAPIはファイルに自己完結しており、_contract_をクリアしています。 https://www.eiffel.com/values/design-by-contract/ –

関連する問題