【问题标题】:React native opening modal wont pressed header back button反应本机打开模式不会按下标题返回按钮
【发布时间】:2021-01-07 14:58:33
【问题描述】:

我使用模态库加载组件,并等待 api 调用加载组件,当 api 调用没有应答时,我希望用户按到标题返回按钮,他们可以继续其他屏幕问题是模式正在打开并且不能按下标题后退按钮,我尝试向模态添加边距或填充,但 rn 模态锁定到所有屏幕,我在打开加载组件时在屏幕图片下方使用反应原生导航和自定义标题

红色组件是我打开的加载组件,我想按下标题左侧的后退按钮并返回到上一个屏幕,rn 模式锁定到所有屏幕并且在加载组件打开时没有按下我如何按下后退按钮

我的加载组件是;

import React from 'react';
import {View} from 'react-native';
import Modal from 'react-native-modal';
import {SkypeIndicator} from 'react-native-indicators';

export const Loading = (props) => {
  return (
    <Modal
      animationType="none"
      transparent={true}
      visible={visible}
      supportedOrientations={['portrait']}
      onRequestClose={() => {}}>
      <View
        style={{
          flex: 1,
          backgroundColor: 'yellow',
          marginTop: 150,
          alignItems: 'center',
          justifyContent: 'center',
        }}>
        <View
          style={{
            width: 70,
            height: 70,
            backgroundColor: 'blue',
            borderRadius: 70,
            justifyContent: 'center',
            alignItems: 'center',
          }}>
          <SkypeIndicator color={colors[indicatorColor]} />
        </View>
      </View>
    </Modal>
  );
};

【问题讨论】:

    标签: react-native react-native-navigation react-native-modal


    【解决方案1】:

    Modal 会阻塞屏幕,您必须先取消 modal,然后用户才能在屏幕上进行交互。为此,您可能需要在模式上添加一个取消/关闭按钮。 其他选项是 OnBackDropPressed OnBackButtonPressed 等等

    参考:https://github.com/react-native-modal/react-native-modal#available-props

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2017-11-14
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多