Question

在我的redux应用程序中，我试图同时使用react-redux和react-navigation：

<Provider store={store}>
        <NavigationContainer>
          <Stack.Navigator>
            <Stack.Screen name="Dashboard" component={Dashboard} />
            <Stack.Screen name="Store" component={Store} />
          </Stack.Navigator>
        </NavigationContainer>
      </Provider>

我的商店看起来像这样：

function Store({props, dispatch, navigation, route}) {
  console.debug(props);//this is undefined
}
...
const mapStateToProps = (state) => {
  return {
    cartItems: state.cartItems,
  };
};

function mapDispatchToProps(dispatch) {
  return {
    ...
  };
}

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

我不知道道具为何返回未定义的内容？

我曾经分别使用react-navigation和react-redux遇到过这个问题。做这个鸡尾酒，现在正面临这个问题。

Answer 1

您的组件代码略有不足，props作为第一个参数传递，因此，您无需像现在这样提取props。

例如：

function Store(props) {
  console.debug(props);
}

或者，您可以在函数定义中提取道具，例如：

function Store({ cartItems }) {
  console.debug(cartItems);
}

props的react-redux状态未定义-功能组件

1 个答案: