2016-07-13 9 views
4

mapDispatchToPropsに追加されたメソッドは、this.propsからアクセスできるはずです。これらのメソッドを "Uncaught TypeError:this.props.onHighlightは関数ではありません"と呼びます。 誰でも何が起こっているのか知っていますか? mapDispatchToPropsのさまざまな代替案を試してみましたが、いずれも機能しませんでした。React-Redux:mapDispatchToPropsメソッドが見つかりません

import React from 'react'; 
    import { addHighlight, deleteHighlight, selectHighlight } from 'actions/highlight'; 
    import { connect } from 'react-redux'; 
    import jquery from 'jquery'; 
    import { styles } from './styles.scss'; 

    const mapDispatchToProps = dispatch => { 
     return { 
     onHighlight: (start, end, selectedText) => { 
      dispatch(addHighlight(start, end, selectedText)); 
     }, 
     onDeleteHighlight: (source) => { 
      dispatch(deleteHighlight(source)); 
     }, 
     onSelectHighlight: (source) => { 
      dispatch(selectHighlight(source)); 
     } 
     }; 
    } 

    const mapStateToProps = state => { 
     return { highlights: state.highlights, 
       currentTopic: state.currentTopic, 
       selectedHighlight: state.selectedHighlight,}; 
    } 

    ... 
    Other code about Highlight object 
    ... 

    export default connect(
     mapStateToProps, 
     mapDispatchToProps 
    )(Highlight); 
+3

二つのことをチェックするために:1 - あなたのコンポーネントの接続のバージョンを使用しての代わりに誤って接続されていないバージョンを使用していることを確認してください。 2-実際には 'this'が実際にコンポーネントインスタンスであることを確認してください。 'this'がバインドされていないイベントハンドラを呼び出さないようにしてください。あなたのコンポーネントのいくつかを投稿したり、あなたが 'onHighlight'を呼び出そうとしていない限り、 – Brandon

答えて

0

bindActionCreatorsを使用してみてください:

import { bindActionCreators } from 'redux' 

const mapDispatchToProps = dispatch => { 
     return bindActionCreators({ 
     onHighlight: addHighlight, 
     onDeleteHighlight: deleteHighlight, 
     onSelectHighlight: selectHighlight 
     }, dispatch); 
    } 
関連する問題