Reactjs 为什么传单给我这个错误，当我在反应？

我试图找到我的代码的任何解决方案，因为我现在有一个关于传单的大问题，我试图直接在地图上呈现一些信息，他呈现，但我不知道为什么当我想显示信息重新加载页面时不起作用。。这是我的代码：

  const [allotmenDevice, setAllotmenDevice] = useState({} as any) 

/// i bring the info from the server using allotment

  const loadAllotment = (deviceId: any) => {
     this function===> allotment(deviceId).then( data => {
            if (data.error){
                setError(data.error)
            } else {
                setAllotmenDevice(data)
            }
        })
    }

使用useEffect从函数保存状态后：

 useEffect (() => {
        const AllotmentId = props.match.params.id
        loadAllotment(AllotmentId)    
        
    },[props])

然后我使用span查看信息是否在这里

 const sideMenuDeviceInfo = () => (
        <>
            
            <div className="sm-wrapper">
                    <div>
                    <span>Longitude: {allotmenDevice.lastLocation?.longitude}</span>
                    <br/>
                    <span>Latitude: {allotmenDevice.lastLocation?.latitude}</span>
                    </div>
            </div>
        </>
    )

是的，在我尝试使用传单呈现这些信息之后，这里出现了：

            <MapContainer center={[allotmenDevice.lastLocation?.longitude, allotmenDevice.lastLocation?.latitude]} zoom={15} scrollWheelZoom={false}>
                <TileLayer
                    attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
                    url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
                />
                <Marker position={[allotmenDevice.lastLocation?.longitude, allotmenDevice.lastLocation?.latitude]}>
                    <Popup>
                    <Link to="/data">Data</Link>
                    </Popup>
                </Marker>
                </MapContainer>
            );

---

所以如果有人能帮我

问题在于，即使您没有传单设置地图视图和标记位置所需的坐标，您也必须无条件地渲染地图和标记

一个简单的解决方案是仅在以下坐标可用时显示地图和标记：

((typeof allotmenDevice.lastLocation !== "undefined") &&
  <MapContainer
    center={[allotmenDevice.lastLocation.longitude, allotmenDevice.lastLocation.latitude]}
    zoom={15}
  >
    <Marker
      position={[allotmenDevice.lastLocation.longitude, allotmenDevice.lastLocation.latitude]}
    >
    </Marker>
  </MapContainer>
)

（（AllotMendDevice.lastLocation的类型！=“未定义”）&&
)

即使变量

allotmenDevice

不包含坐标，您的

是否始终呈现？是否确定

allotmenDevice.lastLocation？.latitude

为set@ghybs必须渲染，因为我使用useEffect生成坐标。。是的，总是这样

new LatLng
C:/Users/troya/Desktop/src/geo/LatLng.js:32
  29 | 
  30 | export function LatLng(lat, lng, alt) {
  31 |  if (isNaN(lat) || isNaN(lng)) {
> 32 |      throw new Error('Invalid LatLng object: (' + lat + ', ' + lng + ')');
  33 |  }
  34 | 
  35 |  // @property lat: Number

((typeof allotmenDevice.lastLocation !== "undefined") &&
  <MapContainer
    center={[allotmenDevice.lastLocation.longitude, allotmenDevice.lastLocation.latitude]}
    zoom={15}
  >
    <Marker
      position={[allotmenDevice.lastLocation.longitude, allotmenDevice.lastLocation.latitude]}
    >
    </Marker>
  </MapContainer>
)