コンポーネントのボタンクリックでアクションを呼び出す方法React Reduxを呼び出さないconnect関数を使用していますが

Question

ここでは、postMessage（）のclickイベントを使用してコールバックをaction/reducerに送信していますが、呼び出すことができ、mは、

import React, { Component, PropTypes } from 'react'; 
    import { connect } from 'react-redux'; 

    export class AddBlogPost extends Component { 
     constructor(state) { 
      super();  
     } 
     postMessage =()=>{ 
      this.props.postMessage(); 
     } 
     render() { 
      return (
       <form> 
        <div className="imgcontainer"> 
        </div> 
        <div className="container"> 
         <label><b>Username</b></label> 
         <input type="text" placeholder="Enter Username" name="uname" onChange={(e) => this.userName = e.target.value} /> 
         <label><b>Subject</b></label> 
         <input type="text" placeholder="Enter Subject" name="sub" onChange={(e) => this.subject = e.target.value} /> 
         <label><b>Comment/Message</b></label> 
         <input type="text" placeholder="Enter Message" name="msg" onChange={(e) => this.message = e.target.value} /> 
         <button type="submit" onClick={(event) => { event.preventDefault(); this.postMessage() }}>Post Message</button> 
         <button type="button" className="cancelbtn" style={{ float: 'right' }}>Cancel</button> 
        </div> 
       </form> 
      ); 
     } 
    } 

これは、これは私のdipatcher

である私のここproptypes

AddBlogPost.PropTypes = { 
     postMessage: PropTypes.func.isRequired 
    } 

です..私は事前にredux.thankを反応させるのに新たなんだ、この中で私を助けてください

export const mapDispatchToProps = (dispatch) => { 
     postMessage:() => dispatch({ type: 'ADD_POST' }) 
    }; 

    export const mapStateToProps = (state) => { 
     return { 
      state: state 
     } 
    } 

    AddBlogPost = connect(mapStateToProps, mapDispatchToProps)(AddBlogPost); 

    export default AddBlogPost; 

Answer 1

返品をお見逃しでしたか？

、私は次の必要がないと思います。この

export const mapDispatchToProps = (dispatch) => { 
    return { 
     postMessage:() => dispatch({ type: 'ADD_POST' }) 
    } 
}; 

Answer 2

するために、この

export const mapDispatchToProps = (dispatch) => { 
    postMessage:() => dispatch({ type: 'ADD_POST' }) 
}; 

を変更

postMessage =()=>{ 
    this.props.postMessage(); 
} 

そして

AddBlogPost.PropTypes = { 
     postMessage: PropTypes.func.isRequired 
    } 

をお試しください

以下のようなコールバックを直接送信することができます

<button type="submit" onClick={(event) => { event.preventDefault(); this.props.postMessage() }}>Post Message</button>