如何在 react-native 中使用 swiper

Question

您好，我怎样才能使用来自Home 组件的数据在Profil 组件中工作。我在Home 组件中有一个状态，我在其中存储来自网络服务的数据。

class Accueil extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      refreshing: false,
      latitude:null,
      longitude:null,
      dataSource:[],
      error:null,
      appState: AppState.currentState,
      currentIndex: 0,
    }
    this.displayPosition = this.displayPosition.bind(this);
  }

getData(){
    fetch("SomeURL")
      .then(res => res.json())
      .then(result => {
        return(
        this.setState({
          dataSource: result
        }));
      })
      .catch(error => {
        console.error(error)
      })
  }

render() {
    return (
      <SafeAreaView style={{ flex:1 }}>
        <View style={styles.main_container}>
          <FlatList style={styles.flatList}
          data={this.state.dataSource}
          extraData = {this.state}
          keyExtractor={(item, index) => item.MembreId}
          renderItem={(item) => <UserItem user={item} displayDetailForUser={this._displayDetailForUser} displaySwipe = {this._displaySwipe}/>}
          numColumns={numColumns}
          refreshing={this.state.refreshing}
          onRefresh={this.handleRefresh} />
        </View>
      </SafeAreaView>
    )
  }
}

如何在Profil 组件中使用this.state.dataSource 以便.map 使用数据的刷卡者？

Answer 1

要将值从一个组件传递到另一个组件，您可以使用以下代码 -

this.props.navigation.navigate('<Your Screen Name>', {
    dataSource: this.state.dataSource
});

现在您可以在您的组件中访问数据存储区，如下所示：

var tempDataSource = [...this.props.navigation.state.params.dataSource]

通过访问来使用它 this.props.navigation.state.params.dataSource 直接使用这个变量，或者你可以像上面一样将它保存在另一个变量中 与您的 swiper 一起使用。

希望对你有帮助，谢谢:)