根据我的观察,Alert对话框似乎是建立在React原生应用程序之上的.

下面的代码演示了一种情况,Alert对话框不断弹出,因为它一遍又一遍地读取相同的条形码

 import * as React from "react";
 import Camera from "react-native-camera";
 import { Alert } from "react-native";

 export default class BarcodeScanSreen extends React.Component<any ,any> {
 private _camera;
 private _onBarCodeRead = e => {
    if (e.type === "QR_CODE") {
        Alert.alert(
            "QRCode detected",
            "Do you like to run the QRCode?",
            [
                { text: "No", onPress: this._onNoPress },
                { text: "Yes", onPress: this._onYesPress }
            ],
            { cancelable: false }
        );
    }
};

 private _onYesPress = () => { /* process the QRCode */ }

 private _onNoPress = () => { /* close the alert dialog. */ }

render() {
    return (
        <Camera
            onBarCodeRead={this._onBarCodeRead}
            aspect={Camera.constants.Aspect.fill}
            ref={ref => (this._camera = ref)}
        >
            {/* Some another somponents which on top of the camera preview... */}
        </Camera>
    );
}
}

有没有办法暂停JS代码,等待Alert的回复?

推荐答案

alert 不会暂停代码.在这种情况下,JS并不是唯一的问题——Camera组件也会在后台运行,这是本机的,它会触发onBarCodeRead侦听器,无论alert 是否存在.

你可以try 在_onBarCodeRead开始时用docs中提到的stopPreview()方法停止相机.

还要注意的是,react-native-camera目前正在从Camera(RCTCamera)迁移到RNCamera,而在新的RNCamera中,我没有看到stopPreview()方法.无论如何,一个简单的标志也可以完成这项工作.

React-native相关问答推荐

如何在 react-navigation v6 中更改标题高度

Error: Invariant Violation: Touchable child must either be native or forward setNativeProps to a native component stack

react-native 自定义视图,原生 prop 没有 propType

使用 resizeMode 封面截断的图像

如何使用 AND/OR 运算符过滤列表/查询 AWS Amplify JavaScript GraphQL

如何在react-native中淡化视图的边缘?

如何在react-native 中加密和解密文本?

如何解决此错误您可能需要适当的加载程序来处理此文件类型

React-Native: measure测量一个视图

如何在我的 React Native Android 应用程序中显示当前的 CodePush 版本标签?

通过 ToolbarAndroid => onIconClicked 显示 DrawerLayoutAndroid

如何在react-native中设置 FlatList 的刷新指示器?

ScrollView bounce的 2 种不同背景 colored颜色

axios 的网络错误和react-native

Ipad 上的 React Native - 错误 - could not connect to development server

无法在react-native元素中扩展 Zip

开始滚动时使 TouchableOpacity 不突出显示元素

在 componentWillUnmount 中清除超时的更好方法

react-native:0.41 app.json

无法读取未定义的属性 string| React.PropTypes | LayoutPropTypes.js