'google-map-react' 中的標記如何根據道具的緯度和經度獲取其位置？

Question

根據https://www.npmjs.com/package/google-map-react ，map 上的標記從經度和緯度道具中獲取其在 map 上的位置。

import React from "react";
import GoogleMapReact from 'google-map-react';

const AnyReactComponent = ({ text }) => <div>{text}</div>;

export default function SimpleMap(){
  const defaultProps = {
    center: {
      lat: 10.99835602,
      lng: 77.01502627
    },
    zoom: 11
  };

  return (
    // Important! Always set the container height explicitly
    <div style={{ height: '100vh', width: '100%' }}>
      <GoogleMapReact
        bootstrapURLKeys={{ key: "" }}
        defaultCenter={defaultProps.center}
        defaultZoom={defaultProps.zoom}
      >
        <AnyReactComponent
          lat={59.955413}
          lng={30.337844}
          text="My Marker"
        />
      </GoogleMapReact>
    </div>
  );
}

在這種情況下， AnyReactComponent是 map 上的標記。 但是，基於 SimpleMap 組件上面定義的組件，它不會將 'lag' 和 'lng' 作為 props。 它需要的唯一道具是“文本”。 但是，如果我給這個“AnyReactComponent”組件的 lat 和 lng 一個值作為道具。 這個“AnyReactComponent”如何用這兩個給定的道具改變它的位置？

Answer 1

看例子：

Marker從不聲明 props，但在App中創建組件時無論如何都會使用它們

GoogleMapReact只是從孩子那里得到lat和lng 道具

如何訪問孩子的道具