Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to use React Native launch options parameter for RCTRootView

I am not a JS or React programmer but I need to use it for my project.

I want to pass in values to my React views from my native code so that it will be rendered by the React engine.

I've tried many variations

My native code looks like:

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"ReactTesting"
                                                   launchOptions:@{@"initialProps" : @"<Text>Hello from native code</Text>"}];

rootView.initialProperties = @{@"initialProps" : @"<Text>Hello from native code</Text>"}; // ???

And in my react code i want to render that JSX:

var ReactForTesting = React.createClass( {

render: function() {
  return (The Launch Options that were sent to this view); //How do I render it?
  }
});

I've tried returning various things in the render function - none would render:

render : function () {
  return this.props; // doesn't work
}

render : function () {
  return this.props.initialProps; // doesn't work
}

render : function () {
  return this.props.initialProps; // doesn't work
}

also fiddling with:
React.createElement()
React.createClass()..
like image 444
Avner Barr Avatar asked Jul 05 '15 08:07

Avner Barr


1 Answers

In AppDelegate.m:

RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                             moduleName:@"ReactTesting"
                                             launchOptions:launchOptions];

NSDictionary *initialProps = [NSDictionary dictionaryWithObject: @"Hello from native code" forKey: @"myProp"];

rootView.initialProperties = dict;

Then you can access this.props.myProp in whichever component you passed to AppRegistry.registerComponent.

Not sure why you're trying to pass a <Text> node through in your string though, that seems like a bad idea. Just pass the text content then use the <Text> component on the JS side.

like image 195
Colin Ramsay Avatar answered Oct 03 '22 06:10

Colin Ramsay