Как ограничиться с помощью React-Leader

Я хочу получить границы текущей карты, чтобы я мог искать эти границы с помощью Overpass API.

Для листовки я знаю, что это всего лишь метод map.getBounds (), но я не знаю, как реализовать это в листке-реакции.

class SimpleExample extends React.Component {
  constructor() {
    super();
    this.state = {
      lat: 51.505,
      lng: -0.09,
      zoom: 13,
    };
  }

  componentDidMount() {
    console.log(this.refs.map.getBounds())
  }

  render() {
    const position = [this.state.lat, this.state.lng];
    return (
      <Map center={position} zoom={this.state.zoom} ref='map'>
        <TileLayer
          attribution='&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
          url='http://{s}.tile.osm.org/{z}/{x}/{y}.png'
        />
      </Map>
    );
  }
}

Это то, что я пробовал. Ошибка говорит о том, что this.refs.map.getBounds не является функцией.


person Jake Hm    schedule 21.11.2016    source источник


Ответы (1)


Попробуйте this.refs.map.leafletElement.getBounds.

Согласно документации:

Вы можете напрямую получить доступ к элементу Leaflet, созданному компонентом, используя this.leafletElement в этом компоненте. Этот элемент листовки обычно создается в componentWillMount (), за исключением компонента Map, где он может быть создан только после визуализации контейнера.

что является круглым способом сказать, что они хранят объект листовки как свойство leafletElement в своих объектах-компонентах.

person Brandon    schedule 21.11.2016
comment
я как бы не понимаю часть except for the Map component where it can only be created after the container is rendered. могу ли я получить новые границы для каждого рендера? Спасибо - person Martin Brisiak; 23.11.2017
comment
Доступ к нему в componentDidMount и componentDidUpdate - person Brandon; 23.11.2017
comment
Вы также можете ознакомиться с stackoverflow.com/questions/51399480/, если этот ответ не решает проблему (для меня часть ref='map' отсутствовала) - person Stéphane; 23.04.2019
comment
refs устарел - person dhiraj; 29.03.2021