处理来自外部服务器的重定向

Question

I have a functionality where when a user clicks on a button, he/ she will be redirected to an external website, where once the work is complete user is navigated back to his/her original page with a query as follows,

http://localhost:3000/settings/online-order?status=complete

What I require is, I need to perform an ajax call when the user is redirected with such a query. I can do this on componentDidMount on my OnlineOrderComponent , but I don't know is it is correct.

I have defined my routes in a separate routes.js file and I tried handling it like this,

<Route path="settings/online-order" component={OnlineOrderComponent}/>
<Route path="settings/online-order?status=complete" onEnter={/*do something here*/}/>

Which seems very wrong. I would appreciate if any of you experts would just point me in the right direction to achieve this. I apologize if this is vague and will clarify if required :) thanks

Answer 1

Using componentDidMount is probably the cleanest way. It seems like you are using react router. You could do something like this:

export Component extends React.Component {
    componentDidMount() {
        if (this.props.location.query.status && this.props.location.query.status === 'complete' ) {
            // do something
        } else {
            // do something else
        }
    }
}