Details about js interface redirection and value transfer

Details about how to jump to the js interface and pass the value. The functions of this example are as follows: Register page (Register. js), click registration, and jump to the registration result page (RegisterResult. js), and pass the registered mobile phone number to the past, indicating that xx registration is successful.

Index. Android. js

'Use strict 'import React, {Component} from 'react'; import {AppRegistry, Navigator, BackAndroid} from 'react-native '; var Register = require ('. /study/Register '); let RegisterResult = require ('. /study/registerresult'); var NaviModule = React. createClass ({// inform Navigator module about the effect configureScene: function (route) {return Navigator when switching views. sceneConfigs. fadeAndroid;}, // inform the Navigator module about how to mount the current view renderScene: function (router, navigator) {this. _ navigator = navigator; switch (router. name) {case "register": return
 
  
Case "registerResult": return
  
   
}, // Life Cycle function of React --- when a component is attached, componentDidMount: function () {var navigator = this. _ navigator; BackAndroid. addEventListener ('navimodulelistener ', () => {if (navigator & navigator. getCurrentRoutes (). length> 1) {navigator. pop (); return true;} return false;}) ;}, // Life Cycle function of React --- Call componentWillUnmount: function () {BackAndroid when the component is removed. removeEventListener ('navimodulelistener ');}, render: function () {return (
   ) ;}}); AppRegistry. registerComponent ('firstdemo', () => NaviModule );
  
 

Registration page (Register. js)

'Use strict 'import React, {Component} from 'react'; import {AppRegistry, StyleSheet, Text, View, TextInput} from 'react-native '; let Dimensions = require ('dimensions '); let totalWidth = Dimensions. get ('window '). width; let leftStartPoint = totalWidth * 0.1; let componetWidth = totalWidth * 0.8; let Register = React. createClass ({getInitialState: function () {return {inputedNum: '', inputedPW:'',}, updatePW: function (newText) {this. setState ({inputedPW: newText}) ;}, render: function () {return (
     
  
   
This. setState ({inputedNum: aa})}/>
   
    
The mobile phone number you entered: {this. state. inputedNum}
       
   
    
This. updatePW (newText)}/>
    
     
Note volume
       
   
  
 );}, UserRegister: function () {this. props. navigator. replace ({telephoneNumber: this. state. inputedNum, name: 'registerresult',}) ;}}); const styles = StyleSheet. create ({container: {flex: 1, flexDirection: 'column', justifyContent: 'center', backgroundColor: '# F5FCFF',}, numberInputStyle: {top: 20, left: leftStartPoint, width: componetWidth, backgroundColor: 'Gray ', fontSize: 20}, textPromptStyle: {top: 30, left: leftStartPoint, width: componetWidth, fontSize: 20}, passwordInputStyle: {top: 50, left: leftStartPoint, width: componetWidth, backgroundColor: 'Gray ', fontSize: 20}, bigTextPrompt: {top: 70, left: leftStartPoint, width: componetWidth, backgroundColor: 'Gray ', color: 'white', textAlign: 'center', fontSize: 60}); module. exports = Register;

Registry result. js

'Use strict 'import React, {Component} from 'react'; import {AppRegistry, StyleSheet, Text, View, TextInput} from 'react-native '; let RegisterResult = react. createClass ({render: function () {return (
         
  
   
{This. props. telephoneNumber} registered successfully
        
 ) ;}}); Const styles = StyleSheet. create ({container: {flex: 1, flexDirection: 'column', justifyContent: 'center', alignItems: 'center', backgroundColor: '# f5fcff',}, text: {flexWrap: 'wrap', backgroundColor: 'Gray ', fontSize: 20, paddingTop: 10, paddingBottom: 10, paddingLeft: 25, paddingRight: 25 },}); module. exports = RegisterResult;