Деструктуризация события Mouse Move в ReasonReact

Question

В данный момент пытаюсь вытащить clientX Отключение события мыши в Reason React. Вот компонент в настоящее время:

type state = {
  count: int,
  hover: bool,
  mouseX: int,
  mouseY: int,
};

type action =
  | Hover
  | MouseMove(ReactEventRe.Mouse.t);

let component = ReasonReact.reducerComponent("EventTracking");

let make = _children => {
  ...component,

  initialState: () => { count: 0, hover: false, mouseX: 0, mouseY: 0 },

  reducer: (action, state) =>
      switch (action) {
      | Hover => ReasonReact.Update({ ...state, hover: !state.hover })
      | MouseMove(event) => ReasonReact.Update({ ...state, mouseX: state.mouseX + 1})
      },

    render: self =>{
      let hoverString = "Hover State => " ++ string_of_bool(self.state.hover);


      <div className="statistics" onMouseEnter={_event => self.send(Hover)} onMouseLeave={_event => self.send(Hover)} onMouseMove={event => self.send(MouseMove(event))}>
        <p>
          (ReasonReact.stringToElement(hoverString))
        </p>
        <p>
          (ReasonReact.stringToElement(string_of_int(self.state.mouseX)))
        </p>
      </div> 
    },
};

Код, который я предполагаю, что мне нужно изменить, находится в моем редукторе MouseMove действие, mouseX необходимо обновить до clientX но я не могу вытащить его из объекта события, не выдав ошибок.

Любой совет был бы хорош, я также понятия не имею, является ли использование этих синтетических событий правильным подходом для отслеживания положения мыши в ReasonReact.

Answer 1

Вы можете запутаться, потому что ReactEventRe.Mouse.t это не тип записи или объекта JS, а абстрактный тип, которым вы манипулируете с помощью функций в ReactEventRe.Mouse, Это довольно просто перевести, хотя. Чтобы получить доступ к clientX собственность, которую вы просто используете clientX, Полностью квалифицированный это будет выглядеть так:

ReactEventRe.Mouse.clientX(event)

PS: вы, кажется, используете устаревшую версию ReasonReact. ReactEventRe был заменен ReactEvent а также ReactReact.stringToElement с ReasonReact.string например.