React - 导航到 Redux 连接组件答案

【问题标题】：React - Navigate to Redux connected componentReact - 导航到 Redux 连接组件
【发布时间】：2015-12-28 10:14:28
【问题描述】：

我正在尝试将 Redux 合并到我的 React 本机应用程序中。我正在使用 React 本机 Navigator 组件进行应用导航。我的 renderScene 方法看起来像这样（带有辅助函数）：

var Login = require('./src/ui/views/login/login');
.
.
.
getRoute: function(routeName){

const Routes = {
  Login: Login,
  Waiting: Waiting,
  LogoView: LogoView
};

return Routes[routeName];

},

_renderScene: function(route, navigator) {
 var component = this.getRoute(route.name);
 console.log('Navigate to:');
 console.log(component);
 var props = {
  navigator: navigator
};
 return React.createElement(component, props);
},

我像这样导出登录组件（和其他组件）：

module.exports = connect((state) =>{state.token})(Login);

导航到使用 Redux 连接包装器方法导出的任何视图都不起作用。我得到的错误是“mapStateToProps must return an object. Instead received undefined”。像这样导出组件时效果很好

module.exports = Login;

由于我想实现 Redux，我将非常感谢有关使用 redux "connect()" 导出的任何帮助或任何提示我做错了什么

非常感谢！

/约翰

【问题讨论】：

标签： navigation react-native redux

【解决方案1】：

connect 内部箭头函数的错误。花括号在这里不起作用。如果你想返回一个对象，你应该把它包裹在括号中：

module.exports = connect((state) => ({token: state.token}))(Login);

有关所有可能的箭头函数用例，请参阅 this answer。

另外，{state.token} 不是有效的对象字面量。您只能对标识符使用较短的形式，例如 {state}。

【讨论】：