callstack / callstack/react-native-paper
[5.14.5] TextInput with multiline inside Portal causes rapid flicker and infinite onChangeText calls [iOS]
- Ngôn ngữ chính
- TypeScript
- Star
- 14.5k
- Fork
- 2.2k
- Merge trung bình
- 5 ngày 23 giờ
- Pull request đã merge (30 ngày)
- 12
Mô tả
### Current behaviour
Typing in a `react-native-paper` `TextInput` with `multiline` **inside a `Portal`** causes rapid flicker and floods `onChangeText` (dozens of calls per second). Removing **either** `Portal` or `multiline` stops the issue.
### Expected behaviour
No flicker; `onChangeText` fires once per user input.
### How to reproduce?
1. Render a multiline `TextInput` inside a `Portal`.
2. Run iOS
3. Focus the field and type characters.
```tsx
import * as React from 'react';
import { Portal, TextInput } from 'react-native-paper';
export default function Repro() {
const [text, setText] = React.useState('');
return (
{
console.count('onChangeText'); // spams rapidly
setText(t);
}}
style={{ minHeight: 120 }}
/>
);
}
```
### What have you tried so far?
- Removing `multiline` → issue gone
- Removing `Portal` → issue gone
### Your Environment
| software | version |
|------------------------|----------|
| ios | x |
| android | x |
| react-native | **0.81.5** |
| react-native-paper | **5.14.5** |
| node | x.x.x |
| npm or yarn | x.x.x |
| expo sdk | N/A |
Hướng dẫn đóng góp
Hướng nghiên cứu
Bắt đầu bằng cách tái hiện vấn đề trên iOS với ví dụ Portal và TextInput multiline được cung cấp, sau đó kiểm tra các entry point của Portal và TextInput. Công việc được xem là hoàn tất khi thao tác nhập không còn gây nhấp nháy và onChangeText được gọi một lần cho mỗi lần người dùng nhập.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Đánh giá
- Công nghệ
- ios, react-native, typescript
- Lĩnh vực
- mobile
- Loại issue
- Lỗi
- Độ khó
- 3/5
- Thời gian dự kiến
- 1-2 ngày
- Mức độ hoạt động
- Đình trệ
- Độ rõ ràng
- Khá rõ ràng
- Mức phù hợp với người mới
- 48/100