React Native：将多个父项props传递给子组件

Question

我有一个React本机应用程序，我正在尝试将道具传递给AppwithNavigationComponent。 我想这样做，以便将Authenticator组件中创建的道具传递到AppwithNavigationState组件中。 但是我一直坚持将多个变量传递给组件：

---- index.js -----

render() {


        return (

          <ApolloProvider store={store} client={client}>
          <Authenticator hideDefault={true} onStateChange={this.handleAuthStateChange}
          theme={Object.assign(AmplifyTheme, styles)}>
          <AppWithNavigationState { ...this.props }/> // passing in props
          </Authenticator>
          </ApolloProvider>

        )
    }

}
export default App = codePush(App);

--- AppNavigator.js ------

const AppWithNavigationState = (props,{ dispatch, nav }) => { // trying to pass in props from parent component, get following error when I do so
  console.log(props);
 return (

  <AppNavigator navigation={addNavigationHelpers({ dispatch, state: nav })} screenProps={{ ...props }} />
)};


AppWithNavigationState.propTypes = {
  dispatch: PropTypes.func.isRequired,
  nav: PropTypes.object.isRequired,
};

const mapStateToProps = state => ({
  nav: state.nav,
});

export default connect(mapStateToProps)(AppWithNavigationState);

^^当我尝试将父项props传递到此组件时，就好像忽略了dispatch和nav组件一样。 我不是按照我应该的方式传递道具吗？ 有没有办法传递多个道具？ 如果我通过了父项道具，则会收到以下错误消息：

Unhandled JS Exception: TypeError: Cannot read property 'index' of undefined

    This error is located at:
        in Transitioner (at CardStackTransitioner.js:60)
        in CardStackTransitioner (at StackNavigator.js:48)
        in Unknown (at createNavigator.js:36)
        in Navigator (at createNavigationContainer.js:198)

但是，如果我不尝试添加父项道具，则一切正常。

Answer 1

我认为您只需要更改：

const AppWithNavigationState = (props,{ dispatch, nav }) =>

至：

const AppWithNavigationState = ({ dispatch, nav }) =>

默认情况下，功能组件只有一个参数，即props对象。 如果传入的props在props对象上具有dispatch和nav ，则上述解构语法只会立即为您提供dispatch和nav变量。

有关功能组件的示例，请参阅文档 。