加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

react-native – React-navigation Redux状态管理

发布时间:2020-12-15 20:44:27 所属栏目:百科 来源:网络整理
导读:我正在学习React Native和Redux,我开始使用第三方库 – 特别是 React Navigation 我已经按照Dan Parker’s Medium Tutorial的教程进行了操作,但仍然无法使用它 我的应用程序的RootContainer: PrimaryNavigation /...export default connect(null,mapDispatc
我正在学习React Native和Redux,我开始使用第三方库 – 特别是 React Navigation

我已经按照Dan Parker’s Medium Tutorial的教程进行了操作,但仍然无法使用它

我的应用程序的RootContainer:

<PrimaryNavigation />
...

export default connect(null,mapDispatchToProps)(RootContainer)

PrimaryNavigation定义:

const mapStateToProps = (state) => {
  return {
    navigationState: state.primaryNav
  }
}

class PrimaryNavigation extends React.Component {
  render() {
    return (
      <PrimaryNav
        navigation={
          addNavigationHelpers({
            dispatch: this.props.dispatch,state: this.props.navigationState
          })
        }
      />
    )
  }
}

export default connect(mapStateToProps)(PrimaryNavigation)

PrimaryNav定义:

const routeConfiguration = {
  LoginScreen: {
    screen: LoginScreen
  },MainContainer: {
    screen: MainContainer
  }
}

const PrimaryNav = StackNavigator(
  routeConfiguration,{
    headerMode: 'none'
  })

export default PrimaryNav

export const reducer = (state,action) => {
  const newState = PrimaryNav.router.getStateForAction(action,state)
  return newState || state;
}

我的创建商店:

const rootReducer = combineReducers({
  ...
  primaryNav: require('../Navigation/AppNavigation').reducer
})

return configureStore(rootReducer,rootSaga)

我得到一个错误:

元素类型无效:期望一个字符串(对于内置组件)或一个类/函数(对于复合组件)但得到:undefined.检查’PrimaryNavigation’的渲染方法

到目前为止我的理解是:

> RootContainer连接到商店 – 它拥有PrimaryNavigation
> PrimaryNavigation包含一个Navigator(PrimaryNav),它包装Navigator并将其传递给状态
> PrimaryNav是实际的导航器 – 我已经定义了路由和默认初始化
>处理PrimaryNav的reducer只是PrimaryNav.router.getStateForAction

我错过了初始状态吗?我没有正确地将它连接到Redux吗?我是否需要启动调度才能进入第一个屏幕?

谢谢

我认为你在代码组织中缺少一些东西.

这是我努力扩展由Tyler Mcginnis完成的github notetaker应用程序.我更新了代码以支持最新版本的React和React Native,我还扩展了应用程序以使用支持iOS和Android的react-navigation.我添加了Redux来管理商店并使用Redux-Sagas来处理数据的异步提取.

https://github.com/ahmedkamohamed/react-native-navigation-redux-sagas

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读