I get this error: TypeError: Cannot read property ‘prototype’ of undefined, js engine: hermes
after running this code, however it displays a map in App Screen, but gives a white page in other screens
import React, { useRef, useEffect } from “react”;
import { View, StyleSheet, LayoutAnimation } from “react-native”;
import MapView, { Marker, PROVIDER_GOOGLE } from “react-native-maps”;
import AppText from “./app/components/Text”;
export default function App() {
const mapRef = useRef(null);
const markers = [
{ id: 1, name: “Marker 1”, lat: 2.537499, long: 32.402118 },
// Add more markers as needed
];
const handleMapLayout = () => {
if (mapRef.current && markers.length > 0) {
const bounds = new MapView.LatLngBounds();
markers.forEach((marker) => {
bounds.extend({
latitude: marker.lat,
longitude: marker.long,
});
});
mapRef.current.fitToCoordinates(bounds, {
edgePadding: { top: 100, right: 100, bottom: 100, left: 100 },
animated: true,
});
}
};
useEffect(() => {
LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
}, );
return (
{markers.map((marker) => (
<Marker
key={marker.id}
title={marker.name}
coordinate={{
latitude: marker.lat,
longitude: marker.long,
}}
/>
))}
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
},
map: {
flex: 1,
},
});
Where have I gone wrong?