我当前的代码发出 GET 请求来获取数据，然后将数据显示为 Google 地图上的标记。我省略了以下代码片段中的一些代码以使其更易于阅读，但我可以向您保证，我删除的代码不是原因。

如果我 离线 映射，则位置的标记会完美地显示在地图上。如果我将其更改为 points （我从路线调用中设置），那么我将收到错误 App.js:66 Uncaught TypeError: Cannot read properties of undefined (reading 'cameras') 。

如何修复此问题？

function App() {
  const [points, setPoints] = useState([]);

  useEffect(() => {
    fetch('/cameras-by-date').then(res => res.json()).then(data => {
      setPoints(data);
    });
  }, []);

  const offline = [
    {
      "cameras": [
        {
          "location": "ANZAC HWY, ASHFORD",
          "position": {
            "lat": -34.9502955,
            "lng": 138.575806
          }
        }
      ],
      "date": "03/09/2022"
    }
  ]

  const { isLoaded } = useJsApiLoader({
    id: 'google-map-script',
    googleMapsApiKey: MAPS_API_KEY
  })

  const [map, setMap] = React.useState(null)

  const onLoad = React.useCallback(function callback(map) {
    const bounds = new window.google.maps.LatLngBounds(center);
    map.fitBounds(bounds);
    setMap(map)
  }, [])

  if (!isLoaded) {
    return
  }

  return (
    <div className="App">
      <header className="App-header">
        <GoogleMap
          mapContainerStyle={containerStyle}
          center={center}
          zoom={10}
          options={options}
          onLoad={map => setMap(map)}
        >
          {offline[0].cameras.map(({ position }) => (
            <Marker
              position={position}
            >
            </Marker>
          ))}
        </GoogleMap>

      </header>
    </div >
  );
}

export default App;