He estado tratando de pasar los datos de las notas a otro componente, pero no sé por qué dice indefinido.
export default App = () => { const [notes, setNotes] = useState([ { key: 1, value: "Hello there what up", title: "Some Title for this" }, { key: 2, value: "I want to take notes", title: "another for this one" }, ]); return ( <View> <FlatList data={notes} renderItem={({ note }) => ( <View> <NoteItem note={note} /> </View> )} /> </View> ); }; export default NoteItem = ({ note }) => { <Text>{note.title}</Text> ); };En primer lugar, suponga que renderItem en Flatlist tiene una propiedad de 'nota' dentro. No lo hace, se llama elemento. ¿También pasa notas pero intenta deconstruir la nota? Debería ser así:
export default App = () => { const [notes, setNotes] = useState([ { key: 1, value: "Hello there what up", title: "Some Title for this" }, { key: 2, value: "I want to take notes", title: "another for this one" }, ]); return ( <View> <FlatList data={notes} renderItem={({ item }) => ( <View> <NoteItem note={item} /> </View> )} /> </View> ); };Esta sintaxis - ({ note }) - significa que el componente NoteItem espera que se establezca una prop llamada note ; sin embargo, en su lugar, está configurando el accesorio de notes .
Prueba esto:
<FlatList data={notes} renderItem={({ item, index }) => ( <View key={index}> <NoteItem note={item} /> </View> )} />