Search code examples
reactjsappjs

I've got this error: Uncaught TypeError: e.lngLat is not a function or its return value is not iterable at handleAddClick (App.js:42:1)


const handleAddClick = (e) =>{   
const [lat, long] =  e.lngLat;<=errr
setNewPlace({lat,long
     });
  };

I want to create an event when I click in a new place to extract the latitude and longitude and to display the result in a popup.

console.log(e.lngLat)
Po {lng: 21.940196455078166, lat: 47.07052843855962}
lat: 47.07052843855962
lng: 21.940196455078166
[[Prototype]]: Object
constructor: class Po
distanceTo: ƒ distanceTo(t)
toArray: ƒ toArray()
toBounds: ƒ toBounds()
toString: ƒ toString()
wrap: ƒ wrap()
[[Prototype]]: Object

Solution

  • You should use object-destructuring instead of array.

    const { lat, lng: long } = e.lngLat;
    
    const handleAddClick = (e) => {
      const [lat, long] = e.lngLat;
      setNewPlace({ lat, long });
    };