onInput для React 360 / React Vr не работает - PullRequest
Новая
       23

onInput для React 360 / React Vr не работает

0 голосов
/ 09 января 2019

Я создаю приложение с открытым исходным кодом, чтобы познакомиться с обработкой ввода из различных источников. Вот веб-страница для документации React для обработки ввода 360 . Прочитав страницу, я не могу заставить работать ввод, и неясно, почему. Вот мой код: 

import React from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View,
} from 'react-360';

export default class ExampleVR extends React.Component {
  render() {
    return (
  <View style={styles.panel}>
    <View style={styles.greetingBox}>

    ***********Why is this not doing anything?**************

      <View onInput={e => {
          const inputEvent = e.nativeEvent.inputEvent;
          console.log(inputEvent);
        }}>
          { /* ... */ }
      </View>

      ****************************
      <Text style={styles.greeting}>
        Welcome to React 360
      </Text>
    </View>
  </View>
);
}
};

Приведенный выше код ничего не делает, и, честно говоря, я не уверен, что он будет делать, если он работает. Из документации я бы подумал, что это будет console.log объект ввода для меня, чтобы увидеть. Это то, что я получил из предыдущего ответа на вопрос, который я видел. То, что я не понимаю, как это срабатывает? Я нажимаю на нее, нажимаю на клавиатуру на моем ноутбуке и ничего. Там не так много информации, чтобы продолжить. Кто-нибудь сталкивался с чем-то подобным раньше?

1 Ответ

0 голосов
/ 09 января 2019

Думаю, я выяснил свой вопрос для дальнейшего использования. В приведенном выше коде <View onInput={....}> является «невидимым», когда я запускаю приложение с npm start. Я удалил окружающие виды, включенные в пример, а затем добавил в него несколько стилей CSS. Вот этот код: 

export default class ExampleVR extends React.Component {


render() {
    return (
        <View style={styles.input} onInput={e => {
            const inputEvent = e.nativeEvent.inputEvent;
            console.log(inputEvent);
          }}>
            { /* ... */ }
        </View>
    );
  }
};

const styles = StyleSheet.create({
  input: {
    width: 1000,
    height: 600,
    backgroundColor: 'rgba(255, 255, 255, 0.4)',
    justifyContent: 'center',
    alignItems: 'center',
  },
}

Это работает, как я и ожидал. Когда я нажимаю на существующую панель или нажимаю клавишу, объект ввода печатается, как и ожидалось.

...