應如何編寫在地圖上輸出Marker的自定義反應組件?我需要有水木清華這樣的工作:如何編寫輸出反應傳單標記的組件?
import MyMarker from './MyMarker.js';
const builtMarker = (function() {
const position = [51.520, -0.11];
return (
<MyMarker position={position}/>
);
})();
render(
<div>
<h1>Hello, world!</h1>
<div className="map">
<Map center={center} zoom={13}>
<TileLayer
url='http://{s}.tile.osm.org/{z}/{x}/{y}.png'
attribution='© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
/>
{builtMarker}
</Map>
</div>
</div>
,
document.getElementById('example')
);
我做MyMarker
組件一樣,https://github.com/varya/react-leaftlet-test/blob/master/src/MyMarker.js但得到的錯誤:
Uncaught TypeError: Cannot read property 'addLayer' of undefined
我猜的成分不僅要延長MapLayer
而且還提供專用接口。什麼不見了?我無法在文檔中找到類似的示例。
另外,我應該怎麼做才能輸出幾個標記?我的意思是,在React中它需要在一個包裝中。但它不能只是<div>
的地圖。應該如何寫這個包裝?
PS:這是我證明我的情況https://github.com/varya/react-leaftlet-test