APSL/react-native-button

Show spinner when the user presses the button?

anthonywebb opened this issue · 1 comments

I have a button that i would like to only submit once.

Ideally I could show a spinner and disable the button after it is pressed. Is this possible? I tried the code below but it didnt seem to work.

<Button onPress={() => { this.isDisabled = {true} }}>My Button</Button>

Hello @anthonywebb!

Yes, it's possible. I assume that you want to submit or perform a network call, so:

<Button 
  isLoading={this.state.apiIsFetchingData} 
  isDisabled={this.state.apiCallFinished}
  onPress={() => {
    this.setState({apiIsFetchingData: true})
    fetch('url').then(response => this.setState({apiIsFetchingData: false, apiCallFinished: true}))
  }}>
  Fetch
</Button>

Your calls must change the state or props, depending if you use Redux or any other mechanism. Please let me know if you need anything else and I'll reopen the issue.