Javascript 世博会无缘无故崩溃

我在这里有一个项目，使用世博会管理的工作流。当我在我的物理设备上运行它时，它只是崩溃并说“不幸的是，Expo已经停止”。崩溃发生在MapScreen.js文件中。我使用->

• 反应本机映射
• 世博会地点
• 反应本地地图方向
• 反应本机模态
• 洛蒂是本地人
• 反应本机路由器流量
• 火基

单击按钮时出现错误（请查找下面的代码）
MapScreen.js

import React, { useState, useEffect } from "react";
import { StatusBar } from "expo-status-bar";
import {
  Button,
  Dimensions,
  Image,
  StyleSheet,
  Text,
  View,
} from "react-native";
import { Poppins_400Regular, useFonts } from "@expo-google-fonts/poppins";
import MapView, { Marker } from "react-native-maps";
import * as Location from "expo-location";
import MapViewDirections from "react-native-maps-directions";
import Modal from "react-native-modal";
import LottieView from "lottie-react-native";
import { Actions } from "react-native-router-flux";
import { firebase } from "../functions/firebase";

const deviceWidth = Dimensions.get("window").width;
const deviceHeight = Dimensions.get("window").height;

const MapScreen = ({ longitude, latitude, searchResult }) => {
  let [fontsLoaded] = useFonts({
    Poppins_400Regular,
  });

  const [errorMsg, setErrorMsg] = useState(null);
  const [mapRegion, setmapRegion] = useState(null);
  const [customMark, setcustomMark] = useState(null);
  const [modal0Show, setmodal0Show] = useState(true);
  const [modal1Show, setmodal1Show] = useState(false);
  const [didAccept, setdidAccept] = useState(false);

  const apikey = "xxxxxxxxxxxxxxxxxxxxxxxxxx";
  useEffect(() => {
    (async () => {
      let { status } = await Location.requestPermissionsAsync();
      if (status !== "granted") {
        setErrorMsg("Permission to access location was denied");
      }
      if (status === "granted") {
        let location = await Location.getCurrentPositionAsync({});
        setmapRegion({
          longitude: location.coords.longitude,
          latitude: location.coords.latitude,
          longitudeDelta: 3,
          latitudeDelta: 3,
        });
      }
    })();
  }, []);

  useEffect(() => {
    if (mapRegion) {
      setcustomMark({ latitude: latitude, longitude: longitude });
    }
  }, [mapRegion]);

  useEffect(() => {
    if (errorMsg) {
      console.log("err " + errorMsg);
    }
  }, [errorMsg]);

  function modalHideShow() {
    setmodal0Show(false);
    setmodal1Show(true);
    searchForDriver();
    searchForUpdates();
  }

  function searchForDriver() {
    firebase
      .database()
      .ref("beforePick/")
      .set({
        searchForDriver: true,
      })
      .catch((err) => {
        setErrorMsg(err);
      });
  }

  function searchForUpdates() {
    firebase
      .database()
      .ref("beforePick/")
      .on("value", (snapshot) => {
        if (snapshot.val().searchForDriver === false) {
          setmodal0Show(false);
          setdidAccept(true);
          setmodal1Show(false);
          Actions.push("lobby");
        }
      });
  }

  return (
    <View style={styles.container}>
      {fontsLoaded && (
        <View>
          <StatusBar hidden={true} />
          {modal1Show === false && (
            <MapView initialRegion={mapRegion} style={styles.mapView}>
              {customMark && (
                <MapViewDirections
                  origin={{
                    latitude: mapRegion.latitude,
                    longitude: mapRegion.longitude,
                  }}
                  destination={{
                    latitude: customMark.latitude,
                    longitude: customMark.longitude,
                  }}
                  apikey={apikey}
                  strokeWidth={3}
                  strokeColor="hotpink"
                />
              )}
              {mapRegion && (
                <Marker coordinate={mapRegion} title="Me" description="Myself">
                  <Image
                    source={require("../images/155-1551908_open-google-current-location-icon.png")}
                    style={styles.currentLocationIcon}
                  />
                </Marker>
              )}
              {customMark && <Marker coordinate={customMark}></Marker>}
            </MapView>
          )}
          {modal0Show && (
            <View
              style={{
                position: "absolute",
                top: deviceHeight - 100,
                height: "auto",
                backgroundColor: "white",
                width: "100%",
              }}
            >
              <Text style={styles.modalText0}>
                {searchResult.address_components[0].long_name}
              </Text>
              <Text style={styles.modalText1}>
                {searchResult.formatted_address}
              </Text>
              <Button
                title="Get Driver !"
                style={styles.modalButton0}
                onPress={modalHideShow}
              />
            </View>
          )}
        </View>
      )}
      <View>
        {modal1Show === true && (
          <View>
            <Modal
              deviceHeight={deviceHeight}
              deviceWidth={deviceWidth}
              isVisible={modal1Show}
              backdropColor="#B4B3DB"
              backdropOpacity={0.8}
              animationIn="zoomInDown"
              animationOut="zoomOutUp"
              animationInTiming={600}
              animationOutTiming={600}
              backdropTransitionInTiming={600}
              backdropTransitionOutTiming={600}
            >
              <View style={styles.modal1Container1}>
                <LottieView
                  style={{
                    width: 40,
                    height: 40,
                  }}
                  source={require("../images/14717-sedan-car-animation.json")}
                  autoPlay
                  loop
                />
                <Text>Looking for Driver...</Text>
              </View>
            </Modal>
          </View>
        )}
      </View>
    </View>
  );
};

import React，{useState，useffect}来自“React”；
从“世博会状态栏”导入{StatusBar}；
进口{
按钮
尺寸，
形象,，
样式表，
文本，
看法
}从“反应本族语”；
从“@expo谷歌字体/Poppins”导入{Poppins_400Regular，useFonts}”；
从“react native maps”导入MapView，{Marker}；
从“世博会地点”导入*作为地点；
从“react native maps directions”导入MapViewDirections；
从“反应本机模态”导入模态；
从“lottie react native”导入LottieView；
从“react native router flux”导入{Actions}；
从“./functions/firebase”导入{firebase}；
const deviceWidth=维度.get（“窗口”）.width；
const deviceHeight=尺寸。获取（“窗口”）。高度；
常量映射屏幕=（{经度、纬度、搜索结果}）=>{
让[fontsLoaded]=使用字体({
罂粟花，
});
常量[errorMsg，setErrorMsg]=useState（null）；
常量[mapRegion，setmapRegion]=useState（null）；
const[customMark，setcustomMark]=useState（null）；
const[modal0Show，setmodal0Show]=useState（true）；
const[modal1Show，setmodal1Show]=useState（false）；
常量[didAccept，setdidAccept]=useState（false）；
const apikey=“XXXXXXXXXXXXXXXXXXXXXX”；
useffect（（）=>{
（异步（）=>{
让{status}=wait Location.requestPermissionsAsync（）；
如果（状态！=“已授予”）{
setErrorMsg（“访问位置的权限被拒绝”）；
}
如果（状态==“已授予”）{
let location=await location.getCurrentPositionAsync（{}）；
setmapRegion({
经度：location.coords.longitude，
纬度：location.coords.latitude，
长德尔塔：3，
latitudeDelta:3，
});
}
})();
}, []);
useffect（（）=>{
if（地图区域）{
setcustomMark（{纬度：纬度，经度：经度}）；
}
}，[mapRegion]）；
useffect（（）=>{
如果（错误消息）{
console.log（“err”+errorMsg）；
}
}，[errorMsg]）；
函数modalHideShow（）{
setmodal0Show（假）；
setmodal1Show（真）；
searchForDriver（）；
searchForUpdates（）；
}
函数searchForDriver（）{
火基
.数据库（）
.ref（“beforePick/”）
.设置({
是的，
})
.catch（（错误）=>{
setErrorMsg（err）；
});
}
函数searchForUpdates（）{
火基
.数据库（）
.ref（“beforePick/”）
.on（“值”，（快照）=>{
if（snapshot.val（）.searchForDriver==false）{
setmodal0Show（假）；
setdidAccept（真）；
setmodal1Show（假）；
行动。推动（“游说”）；
}
});
}
返回(
{fontsLoaded&&(
{modal1Show===false&&(
{customMark&&(
)}
{mapRegion&&(
)}
{customMark&&}
)}
{modal0Show&&(
{searchResult.address\u components[0]。long\u name}
{searchResult.formatted_address}
)}
)}
{modal1Show===true&&(
寻找司机。。。
)}
);
};

这是按钮部分->

{modal0Show && (
                <View
                  style={{
                    position: "absolute",
                    top: deviceHeight - 100,
                    height: "auto",
                    backgroundColor: "white",
                    width: "100%",
                  }}
                >
                  <Text style={styles.modalText0}>
                    {searchResult.address_components[0].long_name}
                  </Text>
                  <Text style={styles.modalText1}>
                    {searchResult.formatted_address}
                  </Text>
                  <Button
                    title="Get Driver !"
                    style={styles.modalButton0}
                    onPress={modalHideShow}
                  />
                </View>
              )}

{modal0Show&&(
{searchResult.address\u components[0]。long\u name}
{searchResult.formatted_address}
)}

知道为什么会这样吗

---

谢谢

我以前也遇到过同样的问题，我的代码中有一部分只在IOS上运行，而没有Andriod出现同样的错误。删除代码的这一部分修复了它。我不能确切地告诉你是什么原因造成的，但我会检查代码的每一部分，检查是什么原因造成的