import React, {Component} from 'react'
import { StackNavigator } from 'react-navigation'
import {connect} from 'react-redux'
import {getAllUsers} from '../actions'
import {List, ListItem} from 'react-native-elements'
import { StyleSheet, Text, View, FlatList } from 'react-native'
const UserDetail = () => {
<View>
<Text>User Detail</Text>
</View>
}
const Home = ({ navigation }) => (
<List>
{typeof users === 'string' &&
<FlatList
data={users}
/>
}
</List>
)
const Stack = StackNavigator({
Home: {
screen: Home
},
UserDetail: {
screen: UserDetail
}
})
class MainScreen extends Component {
componentDidMount(){
this.setState({ users : this.props.getAllUsers() })
}
render() {
const users = typeof this.props.decks === 'string'
? Object.values(JSON.parse(this.props.users)) : ''
return(
<Stack />
)
}
}
function mapStateToProps(users) {
return {
users: users,
}
}
function mapDispatchToProps(dispatch) {
return {
getAllUsers: () => dispatch(getAllUsers()),
}
}
export default connect(
mapStateToProps,
mapDispatchToProps
)(MainScreen)
我有两个问题:
1)我想将用户道具从MainScreen
组件传递到Home
组件,稍后传递给UserDetail
组件。但除了ScreenProps
之外,我在React Navigation文档上看不到任何示例。
2)如果我去UserDetail,让我们说它将是一个单独的组件。让我们说它会调用另一个组件。例如,它如何回到Home
?
我也在这里使用Redux
,并且有些人建议在Redux中使用它,但我仍然无法使其工作。我对React Native或React相当新,但到目前为止我还没有找到关于上述问题的明确答案。