未定義不是React Native中的對象（評估'this.props.dispatch'）

Question

我正在使用React Native和Redux製作一個簡單的Counter應用程序。我想要的是當我點擊加號按鈕時，計數器會+1。

但是當我點擊加號按鈕，錯誤

未定義不是對象（評估 'this.props.dispatch'）發生

。

import React, {Component} from 'react'; 
import {connect} from 'react-redux'; 
import {Text, View, StyleSheet, TouchableOpacity} from 'react-native'; 
import {incrementCounter, decrementCounter} from '../actions'; 

class Main extends Component{ 

    incrementCounter(){ 
     this.props.dispatch(incrementCounter); 
    }; 

    decrementCounter(){ 
     this.props.dispatch(decrementCounter); 
    }; 
    render(){ 
     return(
      <View> 
       <Text>RN + Redux Simple Counter</Text> 
       <Text>{this.props.count}</Text> 
       <View> 
        <TouchableOpacity onPress={this.incrementCounter}> 
         <Text>+</Text> 
        </TouchableOpacity> 
        <TouchableOpacity onPress={this.decrementCounter}> 
         <Text>-</Text> 
        </TouchableOpacity> 
        </View> 
      </View> 
     ); 
    } 
} 

const mapStateToProps = (state) => { 
    return { 
     count: state.count 
    } 
}; 

export default connect(
    mapStateToProps 
)(Main) 

如何解決？ 。在此先感謝...

Answer 1

您需要充分connect您的組件要減少。見documentation

import { connect } from 'react-redux' 

const ConnectedMain = connect(
    mapStateToProps, 
    mapDispatchToProps 
)(Main) 

export default ConnectedMain 

調度是 「間接」 通過mapDispatchToProps

const mapDispatchToProps = (dispatch) => { 
    return { 
    onIncrementClick:() => { 
     dispatch(incrementCounter) 
    } 
    } 
} 

訪問然後調用this.props.onIncrementClick()