-
Notifications
You must be signed in to change notification settings - Fork 349
Open
Labels
bugSomething isn't workingSomething isn't working
Description
Current behavior
I have rendered a list of 40 TextInput fields. When I focus or typed on the last TextInput and scroll up, I notice that the focus and typed text is also applied to the first rendered TextInput.
"@shopify/flash-list": "^2.2.0",
"expo": "~54.0.20",
"react-native": "0.81.5",
Expected behavior
Focusing and typing in a TextInput within a long list should only affect the selected TextInput.
Reproduction
import { FlashList } from "@shopify/flash-list";
import React from "react";
import { StyleSheet, TextInput, View } from "react-native";
export default function App() {
const data = Array.from({ length: 40 }, (_, index) => ({
key: `${index}`,
question: `Question ${index + 1}`,
}));
// Render each TextInput
const renderItem = ({
item,
}: {
item: { key: string; question: string };
}) => (
<View style={styles.itemContainer}>
<TextInput style={styles.input} placeholder={item.question} />
</View>
);
return (
<View style={styles.container}>
<FlashList
data={data}
renderItem={renderItem}
keyExtractor={(item) => item.key}
/>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
padding: 16,
},
itemContainer: {
marginBottom: 10,
},
input: {
height: 40,
borderColor: "gray",
borderWidth: 1,
paddingHorizontal: 8,
},
});
FlashList.TextInput.Issue.1547.mp4
Expo Snack or minimal reproduction link:
https://snack.expo.dev/@krishnank/shopify-flashlist-bug
Platform
- iOS
- Android
- Web (if applicable)
Environment
FlashList version: ^2.2.0
Checklist
- I've searched existing issues and couldn't find a duplicate
- I've provided a minimal reproduction (Expo Snack preferred)
- I'm using the latest version of @shopify/flash-list
- I've included all required information above
Metadata
Metadata
Assignees
Labels
bugSomething isn't workingSomething isn't working