Навигация внутри реагировать-родной-модальный - PullRequest
1 голос
/ 24 октября 2019

У меня есть приложение с навигацией по нижней вкладке (в случае, если это важно), и иногда пользователь может открыть модальное (реагировать-нативно-модальное). В модальном режиме есть кнопки, и я хочу реализовать навигацию внутри модального режима, чтобы при нажатии одной из кнопок пользователь переходил на другой экран ВНУТРИ модального окна (и мог перемещаться назад). Любая помощь приветствуется, спасибо заранее! Пример того, что я хочу:

enter image description here

1 Ответ

0 голосов
/ 26 октября 2019

У меня была одна такая проблема. Но я не сделал это с маршрутом, потому что я нахожусь в маршруте, и я хотел бы открыть другой компонент внутри экрана. Так что я сделал это, используя чистый компонент. Я сделал переменную видимости элемента управления, и другой «экран» показывался, когда пользователь нажимал на кнопку, и скрывался, когда пользователь закрывал ее.

Вот пример:

//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>
        )
    }
}

Надеюсьэто может помочь вам!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...