3

Been experimenting with ReactVR and i have few doubts in handling events.As per the documentation in Cusors and Input,finding out the type of event is as easy as reading type of the event.

Events coming into onInput can be further filtered by inspecting the type field, which will be one of 'MouseInputEvent', 'KeyboardInputEvent', 'TouchInputEvent', or 'GamepadInputEvent'

But in the below code event.type gives undefined.

_onInput(event) {
    console.log(event.type);//undefined
}

i was eventually able to sniff the event type by doing

_onInput(event) {
    let syntheticEvent = event.nativeEvent.inputEvent;
    console.log(syntheticEvent.type);
}

Is this the expected behaviour or am i missing something.

Few related questions

  1. Do we have to sniff events with event.nativeEvent?
  2. How do we find out the target of the event, for eg if i am to bind an onInput event to a Plane , currently inspecting the event.nativeEvent gives the target as a numerical value? Not helpful at all.
  3. Finally, the ReactJS way of calling events doesn't seem to work in ReactVR. For eg, in the former we would just

    <Plane onInput={this._onInput} lit={true} />
    

    But this doesnt work , in the latter we have to

    <Plane onInput={(event) => this._onInput(event)} lit={true} />
    

    Why is this?

Note:i have some exp with ReactJS and ZERO with React Native, i am guessing ReactVR inclines towards the latter pardon if it is obvious

semuzaboi
  • 4,972
  • 5
  • 20
  • 35
  • On of the main contributors explained this a bit [here](https://github.com/facebook/react-vr/issues/112). Take a look. – lmiller1990 Apr 16 '18 at 13:11

1 Answers1

0

This happens because the event object in react is reused and gets flushed immediately after it goes out of the function scope therefore you have to store it as a variable for further use.

Alexander Vitanov
  • 4,074
  • 2
  • 19
  • 22
  • erm ... but it hasn't gotten out of the function scope yet , so shouldn't it be accessible inside the _onInput() ? The question is more of why we are accessing the event type in this manner as described in the question. – semuzaboi Sep 26 '17 at 12:42
  • It's well described in the docs: https://facebook.github.io/react/docs/events.html – Alexander Vitanov Sep 26 '17 at 12:46
  • Believe it or not console.log is asynchronous so it won’t get the result in time @alexander vitanov is correct on the way to handle it – Stephen Bolton Jul 07 '18 at 19:00