還元剤と還元剤との結合

Question

以下のような1つのプロジェクトで、ReduxをFluxと結合させる（良い反応はありますか？ 州（inputText）は私たちのコンポーネント（TOdoInput）にあり、StoreではなくReduxにある必要があります。 Reduxにローカル状態を持たせるのは正しいですか？

class TodoInput extends Component { 

    constructor(props, context) { 
    super(props, context) 
    this.state = { 
     inputText: '' 
    } 
    } 

    handleChange(event) { 
    this.setState({ 
     inputText: event.target.value 
    }) 
    } 

    handleSubmit(event) { 
    event.preventDefault() 
    this.props.addTodo(this.state.inputText) 
    } 

    render() { 
    return (
     <div> 
     <form onSubmit={this.handleSubmit.bind(this)}> 
      <input 
      type="text" 
      placeholder="Type in your todo" 
      value={this.state.inputText} 
      onChange={this.handleChange.bind(this)} 
      /> 
      <input type="submit" value="Submit"/> 
     </form> 
     </div> 
    ) 
    } 

Answer 1

はい正しいです。

ローカル（コンポーネント状態）vsグローバル状態（レデューサー）は懸念事項です。例えば

ユーザ情報

• タブバーを表示するタブ・バー・コンポーネントを取るアクティブなタブを知るべきです。他のコンポーネントは気にしませんので、this.stateで処理されるローカルコンポーネントの状態になる可能性があります。
• 一方、タブのユーザー情報はグローバルな関心事です。実際、多くのコンポーネントのアプリは、名前、年齢などを表示するのに関心があります。したがって、この状態は減速機に保存する必要があります。

あなたのTodoInputの主な役割は、テキストをレデューサーに送る準備をすることです。したがって、入力値はユーザーが入力している間だけ重要です。テキストは、あなたの懸念でOKであることを確認したら、あなたは...あなたがサービスに依頼することができ、テキスト

はタイプミス

があるある

をフォーマットすることができ

• あなたはそれを検証する。このステップでは、あなたの懸念が変化を大切にします。これは現在、他のコンポーネントによって消費される可能性のある値です。したがって、それはグローバルストア（redux reducer）に格納する必要があります。