Блог

Я пытаюсь подключить состояние к реквизитам в одном из моих компонентов. Когда mapPropsToState(state) вызывается, я вижу, что state это именно то, что я хочу, чтобы это было. Однако, когда я пытаюсь зарегистрировать props, я получаю сообщение об ошибке с указанием:

 Uncaught ReferenceError: props is not defined
    at eval (eval at _getCardAndBalance (VM28 Home.bundle:NaN), <anonymous>:1:1)
    at _getCardAndBalance (VM28 Home.bundle:58)
    at Object.onPress (VM28 Home.bundle:235)
    at TouchableText.touchableHandlePress (Text.js:242)
    at TouchableText._performSideEffectsForTransition (Touchable.js:880)
    at TouchableText._receiveSignal (Touchable.js:779)
    at TouchableText.touchableHandleResponderRelease (Touchable.js:491)
    at onResponderRelease (Text.js:194)
    at Object.invokeGuardedCallbackImpl (ReactNativeRenderer-dev.js:286)
    at invokeGuardedCallback (ReactNativeRenderer-dev.js:497)
  

Я не понимаю, что я здесь делаю не так и почему это не работает.

Это мой редуктор:

 const initialState = {}

const calReducer = (state = initialState, action:any) => {

    console.log('CAL reducer with type '   action.type   ' token '   action.token)

    switch(action.type) {

        case CAL_SEND_OTP_TOKEN:
            return {...state, sendOtpToken: action.token}
        case CAL_VERIFY_OTP_TOKEN:
            return {...state, verifyOtpToken: action.token}
        case CAL_GET_PAY_ACCOUNT:
            return {...state, payAccount: action.cards}
        default:
            return state
    }
}

export default calReducer;
  

Это мой компонент:

 const Home = (props: any) => {

  useEffect(() => { 
    console.log("Home --> useEffect() props are: "   props)
  }, [])

return (
        <View style={styles.MainContainer}>
              <ScrollView
          scrollEventThrottle={17}
          contentContainerStyle={{ paddingTop: Header_Maximum_Height }}
          onScroll={Animated.event([
            { nativeEvent: { contentOffset: { y: AnimatedHeaderValue } } }
          ], { useNativeDriver: false })}>
          
            <Text style={styles.TextViewStyle} onPress={ (e) => _getCardAndBalance(e)}>GetCardsAndBalance</Text>
        </ScrollView>
);
};

const mapDispatchToProps = (dispatch:any) => ({
  setCalSendOtpToken: (token: string)  => dispatch(setCalSendOtpToken(token)),
})

const mapStateToProps = (state:any) => { 

  console.log("Home: --> mapStateToProps(): state is: "   state)
  return {
    sendOtpToken: state.calReducer.sendOtpToken,
  }
}

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

Независимо от того, где я останавливаю выполнение кода с помощью точки останова, props всегда не определены. Что не так с этим кодом?