我有一个带有底部标签导航的应用程序(以防它很重要),有时用户可以打开一个模式(react-native-modal)。模态中有按钮,我想在模态中实现导航,以便当用户按下其中一个按钮时,它们被导航到模态内部的另一个屏幕(并且可以向后导航)。任何帮助表示赞赏,在此先感谢!我想要的例子:
问问题
5724 次
1 回答
1
我有一个这样的问题。但是我没有使用路由,因为我在路由中,我想在屏幕内打开另一个组件。所以我使用纯组件做到了。我做了一个控制可见性变量,当用户单击按钮时显示另一个“屏幕”,并在用户关闭它时隐藏。
这是一个例子:
//Parent component
class Parent extends Component {
state = {
viewClhild: false
}
goToChild = (task) => {
this.setState({viewChild: true})
}
onShowClhildChange(viewChild) {
this.setState({ viewChild });
}
render() {
<View>
{
this.state.viewChild
? <ChildScreen onShowClhildChange={this.onShowClhildChange.bind(this)} />
: <Text>Show Parent</Text>
}
<Button
onPress={() => {this.goToChild()}}
>
<Text style={button.text}>Entrar</Text>
</Button>
</View>
}
}
//Child Component
class ChildScreen extends Component {
isChildVisible = (isVisible) => {
this.setState({ viewChild: isVisible })
if (this.props.onShowClhildChange) {
this.props.onShowClhildChange(isVisible);
}
}
constructor (props) {
super(props);
this.state = {
viewChild: this.props.viewChild
}
}
render() {
return (
<View>
<Button
onPress={() => this.isChildVisible(false)}
>
<Text>CLOSE CHILD SCREEN</Text>
</Button>
</View>
)
}
}
我希望它可以帮助你!
于 2019-10-26T20:54:40.420 回答