时间戳

首页 > 解决方案 > React Native 中显示活动指示器时如何锁定所有屏幕的触摸？

javascript - React Native 中显示活动指示器时如何锁定所有屏幕的触摸？

问题描述

我一直在用 React Native 开发一个应用程序，我正在完善它。我的一个错误是，当我显示一个 ActivityIndi​​cator 时，我可以触摸该 ActivityIndi​​cator 组件下方的视图组件。我试过把它放在模态视图中。它有效，但看起来很脏。您对如何锁定触摸有任何其他想法吗？

标签： javascriptandroidiosreact-nativemobile

解决方案

您需要为此制作一个叠加层并按照此处所述添加pointerEvents="none"到其中。

风格

spinner: {
        position: 'absolute',
        left: 0,
        right: 0,
        top: 0,
        bottom: 0,
        justifyContent: 'center',
        backgroundColor: '#f3f3f3'
    }

用法

{loading && <View style={styles.spinner} pointerEvents={'none'}>
        <ActivityIndicator/>
    </View>
}

loading你的条件检查在哪里。

推荐阅读