0

Hi how can I have a swiper working in a Profil Component using the data from a Home component. I have a state in Home component where I stock data from a webservice. 

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>
    )
  }
}

How can I use this.state.dataSource in Profil component in order to .map the swiper with the data ?

Jats1596
  • 1,117
  • 1
  • 13
  • 20

1 Answers1

0

For passing values from one component to another, you can use the below code -

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

Now in your component you can access datastore just like below :

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

use it by accessing this.props.navigation.state.params.dataSource this variable directly or you can save it in another variable just like above and use it with your swiper.

I hope this helps, thanks :)

abhikumar22
  • 1,764
  • 2
  • 11
  • 24
  • Can I add this anywhere in `Home` Component ? – Jats1596 Nov 22 '19 at 10:48
  • profile and home both are different screens or you are calling profile inside homescreen ?? – abhikumar22 Nov 22 '19 at 10:54
  • They are differents Screens. When I click on a profile in `Home` component, it will send me to `UserProfil` – Jats1596 Nov 22 '19 at 10:58
  • ok then.... on click's *on press* in homescreen you have to provide the first code of mine and then on another screen i.e the profile screen you have to access the datasource using my second code @SauceCurry – abhikumar22 Nov 22 '19 at 11:00
  • I got `Invalid attempt to spread non-iterable instance` when I try to console log `tempDataSource` – Jats1596 Nov 22 '19 at 11:10
  • @SauceCurry use this variable this.props.navigation.state.params.dataSource.....have you defined the tempDatasource globally ? – abhikumar22 Nov 22 '19 at 11:11