У меня есть модал, который работает, когда видимый установлен на true при загрузке, однако, если он установлен на false или я закрываю и открываю снова, он не работает на Android

Question

У меня есть информационная карусель в модале. На Ios он отлично загружается и может открываться и закрываться. На Android он открывается идеально, если начальное состояние установлено в true, но когда оно закрыто и вновь открыто, модальное состояние постепенно исчезает, а карусель отсутствует.

Я попытался использовать родной модал и плагин. Использование встроенной кнопки "Закрыть" и аппаратной кнопки "назад" не приведет к закрытию модального режима на Android. Я тестирую на Galaxy Note 8.

Любая помощь будет принята с благодарностью, так как я исчерпал свои усилия, чтобы попытаться заставить ее работать правильно.

Вот раздел модального кода.

//MODAL ACTIONS
_openModal = () => {
  this.setState({ isModalVisible: true });
  console.log(this.state.isModalVisible);
  }

_closeModal = () => {
  this.setState({ isModalVisible: false });
  console.log(this.state.isModalVisible);
}

//RENDER MODAL CONTENT
_renderModalContent() {
    return (
      <Modal
        isVisible={this.state.isModalVisible}
        backdropColor={'black'}
        backdropOpacity={0.7}
        onBackButtonPress={this._closeModal}
        >
        <View style={styles.modalContainer}>
          <PersonalityDisplay
            ptData={ptTypes}
            opType={this.props.opType}
          />
          <View style={styles.closeButton}>
            <Button onPress={this._closeModal}>
              Close
            </Button>
          </View>
        </View>
    </Modal>
  )}

renderInfoPanel() {
    return (
      <Animated.View
        style={this.state.position.getLayout()}
        {...this.state.panResponder.panHandlers}
      >
        {this.renderUserInfo()}
        {this._renderMatchStamp()}
        {this._renderSideIcons()}
        {this._renderModalContent()}
      </Animated.View>
    )
  };


  render() {
    console.log(this.state.isModalVisible)
    return (
      <View>
        {this.renderInfoPanel()}
      </View>
    );
  }
}

Спасибо

Answer 1

Несколько вещей, которые вы лучше заметите в своем коде,

1. Чтобы закрыть с помощью кнопки назад, правильно проп onRequestClose но не на BackButtonPress

2.Inside onRequestClose или кнопка onPress функция стрелки должна использоваться следующим образом onRequestClose={() => this._closeModal()}

3.Modal Компонент не имеет никакой опоры под названием isVisible, это на самом деле visible,

После исправления этих вещей Modal работает отлично.

Помимо этих вещей, когда вы публикуете код, постите только те сообщения, которые имеют отношение к вашей проблеме. В вашем коде три метода и два объекта стиля не имеют реализации, которую сложно отладить для других.