I'm working on a map that asks for permissions for the users location. Than if the location is allowed it finds the users location and then changes the coords of the leaflet map to the coords of the user.But, When compiling the code I get the error
TypeError: Cannot read property 'lat' of null
import { StatusBar } from 'expo-status-bar'; import React from 'react'; import { StyleSheet, Text, View } from 'react-native'; import { MapContainer, TileLayer, Marker, Popup } from 'react-leaflet' import Constants from "expo-constants"; import * as Location from "expo-location"; import * as Permissions from "expo-permissions"; import { render } from 'react-dom'; import 'leaflet/dist/leaflet.css'; export default class App extends React.Component { constructor(){ super(); this.state = { ready: false, where: {lat:null, lng:null}, error: null } } componentDidMount(){ let geoOptions = { enableHighAccuracy: true, timeOut: 20000, maximumAge: 60 * 60 * 24 }; this.setState({ready:false, error: null }); navigator.geolocation.getCurrentPosition(this.geoSuccess, this.geoFailure, geoOptions); } geoSuccess = (position) => { console.log(position.coords.latitude); this.setState({ ready:true, where: {lat: position.coords.latitude, lng:position.coords.longitude} }) } geoFailure = (err) => { this.setState({error: err.message}); } render() { return ( <MapContainer style= center={[this.state.where.lat, this.state.where.lng]} zoom="30" scrollWheelZoom={true} > <TileLayer attribution='© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" /> </MapContainer> ); } }
https://stackoverflow.com/questions/65855615/react-leaflet-typeerror-cannot-read-property-lat-of-null January 23, 2021 at 12:03PM
没有评论:
发表评论