我正在使用 React Native WebView 打开一些复杂的表单步骤。我希望应用程序用户在 WebView 中完成最后一步( http://example.com/completed/ )后重定向 Android 应用程序主页( react native 组件)。

请您参考如下方法:

我已经解决了这个问题:

_onLoad(state) { 
    //I check the url to see if everything goes right 
    if (state.url.indexOf(BASEURL + '/auth/success') != -1) { 
      let token = state.url.split("token=")[1]; 
      token = token.substring(0, token.length - 4); 
      //Here I'm caming back 
      NavigationsActions.back(); 
      //In your case you might do something like this: 
      NavigationsActions.replaceRoute({ 
          id: 'your route id' 
      }); 
      SessionActions.setSession(token); 
    } 
} 

我找到了一个很棒的教程，它可以帮助我理解它是如何工作的here .

这是我的整个组件的样子:

import React, { Component } from 'react'; 
import { 
  StyleSheet, 
  WebView, 
  Text 
} from 'react-native'; 
import NavigationsActions from '../../actions/NavigationsActions'; 
import NavigationConstants from '../../constants/NavigationConstants'; 
import RouteConstants from '../../constants/RouteConstants'; 
import SessionActions from '../../actions/SessionActions'; 
 
var BASEURL = 'http://localhost:8080'; 
 
class FacebookLogIn extends Component { 
  render() { 
    return ( 
      <WebView onNavigationStateChange={this._onLoad} style={styles.container} source={{ uri: BASEURL + '/auth/facebook' }}/> 
    ); 
  } 
 
  _onLoad(state) { 
    console.log(state.url); 
    if (state.url.indexOf(BASEURL + '/auth/success') != -1) { 
      let token = state.url.split("token=")[1]; 
      token = token.substring(0, token.length - 4); 
      NavigationsActions.back(); 
      SessionActions.setSession(token); 
    } 
  } 
} 
 
const styles = StyleSheet.create({ 
  container: { 
    flex: 1 
  } 
}); 
 
module.exports = FacebookLogIn;