gribnoysup / react-yandex-maps

Yandex Maps API bindings for React
MIT License
329 stars 116 forks source link

How to fasten suggest (search hints) to react #211

Closed rls200 closed 4 years ago

rls200 commented 4 years ago

Suggest How can I implement this functionality in React. A simple example with input to offer hints when entering an address

<input type="text" id="suggest"/>
<script src="//api-maps.yandex.ru/2.1/?lang=ru_RU&load=SuggestView&onload=onLoad">
</script>
<script>
function onLoad (ymaps) {
    var suggestView = new ymaps.SuggestView('suggest');
} 
</script>
mmarkelov commented 4 years ago

@razhihan11 like so:

import React from "react";
import ReactDOM from "react-dom";
import { YMaps, Map } from "react-yandex-maps";

import "./styles.css";

function App() {
  const loadSuggest = ymaps => {
    const suggestView = new ymaps.SuggestView("suggest");
  };
  return (
    <div className="App">
      <input type="text" className="form-control" id="suggest" />
      <YMaps>
        <Map
          onLoad={ymaps => loadSuggest(ymaps)}
          defaultState={{ center: [55.751574, 37.573856], zoom: 9 }}
          modules={["SuggestView"]}
        />
      </YMaps>
    </div>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);
dcristafovici commented 3 years ago

@mmarkelov Thanks very much, but it's possible hide map? I need only suggest

UPD. And when i type , how get data for this address( Position e.t.c)