Как отключить события мыши в компоненте React (диаграммы для реакции)?

#reactjs #user-interface #dom-events #mouseevent #onclicklistener

Вопрос:

Я создал карту деревьев в React, используя echarts-for-react (https://github.com/hustcc/echarts-for-react). Древовидная карта работает и правильно отображается на странице, но она не «блокируется» на странице. Если вы выбираете его с помощью мыши, он перемещается, если вы прокручиваете рядом с ним, он увеличивается и уменьшается, и вы, как правило, можете использовать мышь, чтобы перемещать его по странице с ее первоначального местоположения. Если вы обновите страницу, она вернется в исходное расположение.

Я хотел бы отключить все события мыши в компоненте, чтобы он просто блокировался на странице, но так как этот пакет не требует onClick поддержки и т. Д. не совсем уверен, что делать. Я никогда раньше не сталкивался с этой проблемой, и библиотека, похоже, нуждается в onEvents поддержке; для этого нужен словарь. Я написал что-то вроде этого:

 const preventEventsHandler = () => {
  console.log('prevent events handler called');
}

const onEvents = {
  "click": preventEventsHandler,
};

return <ReactECharts onEvents={onEvents} />;
 

Если вы запустите этот код все еще работает должным образом, и функция не вызывается, пока он не нажал на (Я могу сказать, эта часть работает, потому что оператор Print возвращает в консоли), но я не уверен, как вы могли бы сделать событие свойств (чтобы использовать e.preventDefault или что-то подобное) или, как обычно, только пусть это будут заблокированы на страницу. Мы будем признательны за любой совет. Заранее спасибо.

Ответ №1:

добавление стиля={{ События указателя: «нет»}} помогло отключить события мыши