Блог

Я использую expo. Единственное, что я создал, это простой компонент TextInput для обработки пользовательского ввода. Проблема в том, что когда я пишу некоторый текст во входных данных, а затем набираю клавишу пробела на клавиатуре. Пробел записывается в поле ввода, но событие onKeyPress не вызывается. Аналогично, если я пишу какой-либо текст, а затем дважды нажимаю кнопку пробела, вызывается событие onKeyPress, но клавиши nativeEvent — это ‘Backspace’ и ‘ ‘.

Вот код, который используется для его тестирования:

 import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { StyleSheet, Text, TextInput, View } from 'react-native';

export default function App() {
  let textInputChangeHandler = ev => {
    console.log(ev.nativeEvent);
    //socket.type(ev.nativeEvent.key);
  };
  return (
    <View style={styles.container}>
      <TextInput onKeyPress={textInputChangeHandler} style={styles.textInput}/>
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
  textInput: {
    borderColor: "black",
    borderWidth: 1,
    width: 200
  }
});
 

Пример ввода:
Напишите «Привет» —> затем введите пробел два раза

Вывод журнала консоли:

 Object {
  "key": "H",
}
Object {
  "key": "e",
}
Object {
  "key": "l",
}
Object {
  "key": "l",
}
Object {
  "key": "o",
}
Object {
  "key": "Backspace",
}
Object {
  "key": " ",
}
 

Ожидаемый результат:

 Object {
  "key": "H",
}
Object {
  "key": "e",
}
Object {
  "key": "l",
}
Object {
  "key": "l",
}
Object {
  "key": "o",
}
Object {
  "key": " ",
}
Object {
  "key": " ",
}
 

Если я введу один пробел, результат будет следующим::

 Object {
  "key": "H",
}
Object {
  "key": "e",
}
Object {
  "key": "l",
}
Object {
  "key": "l",
}
Object {
  "key": "o",
}
 

но я ожидаю, что:

 Object {
  "key": "H",
}
Object {
  "key": "e",
}
Object {
  "key": "l",
}
Object {
  "key": "l",
}
Object {
  "key": "o",
}    
Object {
  "key": " ",
}
 

Я использовал свой Motorola One 5g для тестирования. Я не проводил никаких тестов на эмуляторе.