Question

我是新手，反应原生和反应传奇。我有api调用工作，据我所知，一切都按预期工作。但是，如何显示从服务器返回给用户的错误。对不起，如果这是一个微不足道的问题。这是我到目前为止的代码

集装箱/ GetUserInfo.js

moveToJoinScreen(){
    this.props.getStudentAvator(vouchercode, DeviceInfo.getUniqueID(), 'iOS');
}

render () {
    return (
      <View style={styles.container}>
        <TouchableHighlight onPress={() => this.moveToJoinScreen()}  underlayColor='#ff000000'>
          <Image style={styles.imagestyle} style={{height:60, width:150}} source={Images.joinNow} />
        </TouchableHighlight>
        <Text style={styles.welcome}>
          {'\n'}
        </Text>
        <TouchableHighlight onPress={() => this.moveToRegisterScreen()}  underlayColor='#ff000000'>
            <Image style={styles.imagestyle} style={{height:80, width:150}} source={Images.registerMyId} />
        </TouchableHighlight>
      </View>
    )
  }
}

const mapDispatchToProps = dispatch => ({
  getStudentAvator:(emailaddress, deviceid, platform) => dispatch(StudentActions.SetupVoucherRequest(vouchercode, deviceid, platform))
})

export default connect(null, mapDispatchToProps)(LaunchScreen)

这是saga.js

export function* SetupVoucherRequest(api, action) {
    const { vouchercode, deviceid, platform } = action
    if(vouchercode.length >11 || vouchercode.length < 10)
    {
        yield put(StudentCardActions.SetupVoucherFailuer())
        return
    }
    // make the call to the api
    const response = yield call(api.SetupVoucher, vouchercode, deviceid, platform)

    if (response.ok) {
        const firstUser = 'fahad'
        const avatar = 'Avatar_Fahad'
        // do data conversion here if needed
        yield put(StudentCardActions.SetupVoucherSuccess(avatar))
    } else {
        yield put(StudentCardActions.SetupVoucherFailuer())
    }
}

不确定如何将错误传回容器页面以显示错误。任何帮助将不胜感激。提前致谢

Answer 1

当您致电put(StudentCardActions.SetupVoucherFailuer())时，您应该使用错误更新您的状态，然后通过mapStateToProps将错误传递给您的用户

const mapStateToProps = state => ({
  error: state.myStoreName.error,
  // depending on how your store is setup you might
  // have to use state.get('myStoreName').error
})

export default connect(mapStateToProps, mapDispatchToProps)(LaunchScreen)

现在，您可以通过this.props.error

访问您的用户界面中的错误

React native redux saga如何向用户显示错误

1 个答案: