react / react/react-native

TextInput onKeyPress fires after the onChange

Đang mở
#48,636 9 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Component: TextInput Needs: Attention Needs: Repro Newer Patch Available
Ngôn ngữ chính
C++
Star
127k
Fork
25.3k
Merge trung bình
1 ngày 23 giờ
Pull request đã merge (30 ngày)
4

Mô tả

Description

According to the docs the keyPress event should fire before the change event. That does not seem to be the case though, I've run into this on a physical device in a project (doesn't use expo) I can't share and also reproduced this on a online playground for react native with expo.

In the video you can see that the console.log in the onChange callback happens before the cosnole.log in the onKeyPress callback:

https://github.com/user-attachments/assets/6e5b8cd5-6452-42a7-b315-54c911933a14

Steps to reproduce
  1. Add the onKeyPress and onChange callbacks to a TextInput
  2. Trigger both events by pressing any key on a keyboard
  3. see that onChange triggers first
React Native Version

tested on 0.74.5 and 0.76.6

Affected Platforms

Runtime - Android

Output of npx react-native info
info Fetching system and libraries information...
System:
  OS: Linux 5.10 Manjaro Linux
  CPU: (8) x64 Intel(R) Core(TM) i7-10610U CPU @ 1.80GHz
  Memory: 18.82 GB / 30.99 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 18.18.2
    path: /usr/local/bin/node
  Yarn:
    version: 1.22.22
    path: /usr/local/bin/yarn
  npm:
    version: 9.8.1
    path: /usr/local/bin/npm
  Watchman: Not Found
SDKs:
  Android SDK: Not Found
IDEs:
  Android Studio: AI-241.18034.62.2411.12169540
Languages:
  Java: Not Found
  Ruby:
    version: 2.6.8
    path: /home/owner/.rbenv/shims/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.74.5
    wanted: 0.74.5
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: false
  newArchEnabled: false
Stacktrace or Logs
no logs to show
Reproducer

https://snack.expo.dev/@ncpa/rn-bug

Screenshots and Videos

No response

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Hướng nghiên cứu

Bắt đầu với trình tái hiện Snack được liên kết và tài liệu React Native TextInput, tập trung vào thứ tự của onKeyPress và onChange trên Android. Theo dõi đường dẫn sự kiện TextInput liên quan và thêm hoặc cập nhật một bài kiểm thử hồi quy nếu repository có; được xem là hoàn tất khi thứ tự quan sát được trên Android khớp với hành vi được ghi trong tài liệu hoặc tài liệu phản ánh chính xác việc triển khai.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
react-native
Lĩnh vực
mobile
Loại issue
Lỗi
Độ khó
4/5
Thời gian dự kiến
3-5 ngày
Mức độ hoạt động
Ít trao đổi
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
42/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.