通过TabNavigator将redux操作传递给另一个组件

时间:2017-04-22 19:29:05

标签: reactjs react-redux

我刚刚完成本教程https://www.youtube.com/watch?v=3msLwu25SQY&list=PLk083BmAphjtGWyZUuo1BiCS_ZAgps6j5

现在我想实现看起来像这样的TabNavigator



import React, { Component } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import { ActionCreators } from '../actions'
import { TabNavigator } from 'react-navigation'
import Home from './Home'

const Tabs = TabNavigator({
    Home: {
        screen: Home,
    }
})

class AppContainer extends Component {

    render(){
        return <Tabs {...this.props}/>
    }
}

function mapDispatchToProps(dispatch){
    return bindActionCreators(ActionCreators, dispatch)
}

export default connect((state) => { return {} }, mapDispatchToProps)(AppContainer)
&#13;
&#13;
&#13;

然而,redux动作没有传递给Home组件,我得到一个错误说this.props。[actionname]不是函数。

1 个答案:

答案 0 :(得分:0)

告诉你我的项目

export default class App extends React.Component {
  render() {
    return (
        <Provider store={store}>
            <Navigator
                initialRoute={{component: AppTabs}}
                renderScene={(route, navigator) =>
                    <route.component {...route.args} navigator={navigator} />
                }
            />
        </Provider>
    )
  }
}

将AppTabs更改为您的标签,它可能有效。