React-leafletのカスタムコンポーネント、リーフレットからポリラインを拡張する方法は？

Question

私はそれにカスタム変数を追加できるように反応リーフレットコンポーネントを拡張しようとしています。

ポリラインに「id」を追加する必要があります（ユーザーがクリックするとIDを取得し、サーバーコールを呼び出してデータを収集できます）。私はマーカーのために同じことをしなければならなかったし、この回避策を見つけた：

markers = nextProps.buses.map((bus, i) => { 
    let iconCustom = new L.Icon.Default({internalId: bus.internalId}); 
    this.markersDirectAccess[bus.internalId] = { 
    ...bus 
    }; 

    return { 
    lat: bus.latitude, 
    lng: bus.longitude, 
    popup: bus.busId, 
    options: {icon: iconCustom} 
    } 
}); 

私はそれを行うには正しい方法だ場合、完全にはわかりません。しかし、Polylineコンポーネントについては私は立ち往生していません。 私はthis answerを見つけました。反応小冊子にそれを適用したいのですが、どうすればいいのか分かりません。これは私の拡張コンポーネントの現在の状態です：

import L from 'leaflet' 
import { Polyline } from 'react-leaflet' 
import PropTypes from 'prop-types'; 


export default class PolylineCustomId extends Polyline { 
    static propTypes = { 
    positions: PropTypes.array, 
    } 

    createLeafletElement (props: Object): Object { 
    return L.Polyline(props) 
    } 
} 

Answer 1

私はあなたのためにカスタムコンポーネントが必要と思わないです。 IDを返すポリラインごとにクリックハンドラを追加するだけで済みます。トリックをしたhttps://jsfiddle.net/31euue73/1/