Реакция: вложенный в карточку onClick не называется - PullRequest
Новая
       4

Реакция: вложенный в карточку onClick не называется

0 голосов
/ 18 марта 2020

Я использую реагирующие перехватчики, и я удалил другие функции, не связанные с функцией, которую я собираюсь вызвать. Функции приложения отображаются 

function App() {
  const memoizedCallback = React.useCallback(() => {
    console.log("Click happened");
  }, []);

  return (
    <div className="App">
      <ReactMapGl
        {...viewport}
        mapboxApiAccessToken={accesstoken}
        onViewportChange={viewport => {
          setviewport(viewport);
        }}
      >
        {details.map(details => (
          <Marker
            key={details.name}
            latitude={details.lat}
            longitude={details.long}
          >
            <button
              class="marker-btn"
              onClick={e => {
                e.preventDefault();
                useselectedpark(details);
              }}
            >
              <img src={icon} alt="icon" className="navbar-brand" />
            </button>
          </Marker>
        ))}

        {selectedpark ? (
          <Popup
            latitude={selectedpark.lat}
            longitude={selectedpark.long}
            onClose={() => {
              useselectedpark(null);
            }}
          >
            <div>
              <Card style={{ width: "18rem" }}>
                <Card.Body>
                  <Card.Title>{selectedpark.name}</Card.Title>
                  <Card.Text>{selectedpark.postalcode}</Card.Text>
                  <div>
                    <Button variant="primary" onClick={memoizedCallback}>
                      Visit Gallery
                    </Button>
                  </div>
                </Card.Body>
              </Card>
            </div>
          </Popup>
        ) : null}
        {console.log("in render", details)}
      </ReactMapGl>
    </div>
  );
}

export default App;

. Я собираюсь вызвать функцию memoizedCallback. Функция вызывается в onClick кнопки на карте.

Последовательность событий такова. Появится всплывающее окно, и у пользователя есть возможность нажать на кнопку на карте, которая появляется.

Проблема: В настоящее время, когда кнопка нажата прямо сейчас, функция memoizedCallback не вызывается.

Почему так, что я здесь упустил?

...