React Native:与现有应用程序集成

时间:2017-02-28 18:23:44

标签: android facebook react-native

我刚开始做出反应,我遵循了关于在React Native Docs中集成现有应用程序的教程。

private ReactRootView mReactRootView;
.......

Bundle launchOptions = new Bundle();
launchOptions.putBoolean("test", true);
//mReactRootView.startReactApplication(mReactInstanceManager, "ThirdAwesomeComponent", launchOptions);
mReactRootView.startReactApplication(mReactInstanceManager, "ThirdAwesomeComponent", null); // Actual example

有没有办法在index.android.js

的HelloWorld组件中读取launchOptions

此外,我还有两个活动需要调用react本机守护程序,并希望呈现服务器返回的两种不同布局。

我怎么能这样做,因为目前我只有一个:

AppRegistry.registerComponent('HelloWorld', () => HelloWorld);

2 个答案:

答案 0 :(得分:0)

最好的办法是做点什么,

使用

从索引页面重定向到App.js.

AppRegistry.registerComponent( “应用程序”,()=> APP)

这将重定向到应用

然后根据服务器输出渲染两个不同的场景。您可以创建一个状态变量并将其初始化为默认状态。

在您组件的渲染功能中,您可以检查状态值并根据需要分配布局。

使用类似

的内容
  export default Class App extends Component{
constructor(props){
super(props)
this.state{
    data1:false,
    data2:true,
    loaded:false,
}
}


//do all the fetching data to server here


componentWillMount(){
//after fetching the data to server

    change the state as

    this.setState({
        data1:true,
        data2:false,
        loaded:true
    })
}


render({
    if(this.state.loaded && this.state.data1){
        return(
            //layout which you want to return
        )
    }else if( this.state.loaded && this.state.data2){
        return(
            //second layout code
        )
    }else{
         return(
                //can create a loading spinner here
              <Text>Loading.....</Text>
         )
     }
  })
}

希望这有帮助

干杯

答案 1 :(得分:0)

您的启动选项将作为道具传递给组件的构造函数。 只需实现构造函数

constructor(props){
  super(props)
  // do stuff to pops dictionary
}