ディスパッチを使用する場合

Question

フォームを送信するときにディスパッチを使用したいが、定義されていないというエラーが表示されます。私は何が間違っているのか分かりません。誰かがエラーを見つけられるかどうか疑問に思っていましたか？

また、私は他の人々のコードを見ていました。時にはディスパッチを使用することもあり、時にはthis.propsを使用することもありました。あなたがmapDispatchToProps機能を提供しない場合は

submitRenter(e){ 
    e.preventDefault() 
     dispatch(addUser()); 
    } 



    render() { 



    return (
    <form> 
     <label> 
     <input type="text"/> 
     </label> 

     <button onClick={this.submitRenter} type="submit">Sumbit</button> 

    </form> 


    ) 
    } 
} 

function mapDispatchToProps(dispatch) { 
    return { 
    actions: bindActionCreators({ 
     addUser 
    }, dispatch) 
    }; 
} 


export default connect(
    mapStateToProps, 
    mapDispatchToProps 
)(RegisterRenter); 

Answer 1

、そしてconnectは、そのデフォルトの動作を使用して、コンポーネントthis.props.dispatchを与えるだろう。 をにする場合は、関数を指定します。返す値は、返される値に応じて、dispatchをその戻り値に手動で含める必要があります。

「バインド」アクション作成者のポイントは、明示的にdispatch()機能を使用することなく使用できるようにすることです。これは、Reduxに接続されていない子にアクションクリエータを小道具として渡す場合に特に便利です。

私は個人的には常にバインドアクションクリエイターを推奨していますが、それ以上でも、connectがmapDispatchをサポートするオブジェクト省略形構文を使用することをお勧めします。例として：

import {addUser} from "./userActions"; 

const actions = { 
    addUser 
}; 

class RegisterRenter { 
    submitRenter(e) { 
     e.preventDefault(); 
     this.props.addUser(); 
    } 

    // rendering, etc 
} 

export default connect(mapState, actions)(RegisterRenter); 

詳細情報については、Redux FAQ entry on "why don't I have props.dispatch?"を見て、私のブログの記事Idiomatic Redux: Why use action creators?。