如果在console.log中成功获取数据,如何显示成功消息?

时间:2019-04-17 15:00:28

标签: reactjs api react-native fetch stripe-payments

我在react-native中使用Stripe库,我正在console.log中成功获取数据,但是如果成功,或者如果有任何错误然后在页面上显示,我想重定向到另一个页面。我试图重定向到另一个页面,但是即使有错误也正在重定向,我不知道该怎么做。我已经尝试过这样做。.

这是我的代码。

    payme() {
            const apiKey = '<api_key>';
            const client = new Stripe(apiKey);
            client.createToken({
                number: this.state.number,
                exp_month: this.state.expmonth,
                exp_year: this.state.expyear,
                cvc: this.state.cvc,
            }).then((x) => {
                    let successmsg = x;
                    NavigationService.navigate('LoginPage');
            }).catch((e) => {
                console.log(e);
            })
        }

    render() {
            return (
              <Text>{this.successmsg}</Text>
            )
    }

enter image description here

任何人都可以帮助我有关如何显示错误以及如何仅在成功后才能重定向到其他页面的情况。

1 个答案:

答案 0 :(得分:1)

根据您的代码,您将在this.successmsg

中得到错误
    state = {
     successmsg : null          
    }

    async payme() {
            try{
                   const apiKey = '<api_key>';
                   await result  = new Stripe(apiKey).createToken({
                   number: this.state.number,
                   exp_month: this.state.expmonth,
                   exp_year: this.state.expyear,
                   cvc: this.state.cvc,
                   })

                   if(!result.error){
                      //do your success logic
                     //set your successmsg based on reslut object option
                      this.setState({successmsg : "YOURCUSTOM MESSAGE FROM RESULT OBJECT"})
                      NavigationService.navigate('LoginPage');

                   } else {
                      // throw your error here
                        throw "something went wrong"
                    }

             }
             catch(e){
              throw new Error(e);
             }

        }

    render() {
            return (
              <Text>{this.successmsg}</Text>
            )
    }