Question

我注意到我正在FlatList中进行渲染，我想导航到被点击的项目。我如何通过导航发送整个项目而不是进行id={id} name={name} etc，是否可以导航到该项目并将整个项目发送到视图？

class MyNotes extends Component {
  render() {
    const { notes, navigate } = this.props;
    return (
      <View style={styles.view}>
        <FlatList
          numColons={notes.length}
          data={notes}
          renderItem={({ item: { id, name } }) => {
            return (
              <View>
                <Note
                  name={name}
                  id={id}
                  navigate={navigate}
                />
              </View>
            );
          }}
          keyExtractor={item => item.id}
        />
      </View>
    );
  }
}
export default Notes;

Answer 1

为您的笔记项目创建onPress处理程序，您可以将笔记项目传递到视图

renderItem={({ item }) => {
        return (
          <View>
            <Note
              name={item.name}
              id={item.id}
              navigate={navigate}
              onPress={() => navigate('Note', {...item})}
            />
          </View>
        );
      }}

Answer 2

是的，您可以使用spread operator通过。因此，在您的情况下，将是

<Note {...item} />

从FlatList导航到项目，然后将整个项目发送到

2 个答案: