React Native - initialProperties Android

问题描述:

我在React-Native下工作,我正在寻找通过Java传递初始道具给JS。这可以容易地在Objective-C与initialProperties做过这样的:React Native - initialProperties Android

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

凡initialProperties是NSDictionary这将在JSON经由this.props进行转换,并可用在JS。 所以我期待在Android中也这样做。任何帮助?谢谢

在Android中,您可以将initialPropertieslaunchOptions作为一个包。

由于在源代码这里提到:https://github.com/facebook/react-native/blob/7377fdcc70b25eb023e7c6d1b37eeae2a700cb88/ReactAndroid/src/main/java/com/facebook/react/ReactRootView.java#L325-L334

所以,你可以做这样的事情:

Bundle initialProps = new Bundle(); 
initialProps.putString("myKey", "myValue"); 

mReactRootView.startReactApplication(mReactInstanceManager, "MyAwesomeApp", initialProps); 
+0

这个奇妙的作品。为什么其他答案谈论'ReactActivityDelegate'? –

+0

是否可以传入结构化数据,类似于您可以将值的NSDictionary传递给iOS中的React Native?或者只有标量值可能? –

由于反应母语v0.20的,你可以覆盖的getLaunchOptions方法MainActivity.java文件。

@Override 
protected Bundle getLaunchOptions() { 
    Bundle opts = new Bundle(); 
    opts.putBoolean("someValue", true); 
    return opts; 
} 

这将允许您从主应用程序组件的道具访问someValue

class App extends React.Component { 
    static propTypes = { 
    someValue: PropTypes.bool, 
    }; 

    render() { 
    return <SomeComponent someValue={this.props.someValue} />; 
    } 
} 

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

小心,不赞成这种方式在反应本土> 0.34

https://github.com/facebook/react-native/pull/9320

这是提交信息:

Move `getLaunchOptions` from ReactActivity to ReactActivityDelegate 
Summary: 
After 3c4fd42, `getLaunchOptions` no longer exists in class `ReactActivity`. 
We need refactor UIExplorerActivity to fix the build error. 
Closes #9320 

Differential Revision: D3696381 

Pulled By: astreet 

fbshipit-source-id: 5700cf2363029a95cfbdaf6230e4f82ea69fb472 
master (#2) v0.34.0-rc.0 

因此,如果您更新您的反应版本,您需要更改这部分代码,并且由于您重写了父类中不存在的方法,因此您可能不会收到任何错误消息, “会很难调试

+0

尽管此链接可能会回答问题,但最好在此处包含答案的重要部分,并提供供参考的链接。如果链接页面更改,则仅链接答案可能会失效。 - [来自评论](/ review/low-quality-posts/13661616) – Pongpat

+1

对,我编辑了我的答案以显示提交消息 – Thibaut

getlauchOptions已被移动内部ReactActivityDelegate,现在我用这个代码:

public class MainActivity extends ReactActivity { 

/** 
* Returns the name of the main component registered from JavaScript. 
* This is used to schedule rendering of the component. 
*/ 
@Override 
protected String getMainComponentName() { 
    return "myAppName"; 
} 

@Override 
protected ReactActivityDelegate createReactActivityDelegate() { 
    return new ReactActivityDelegate(this, getMainComponentName()) { 
     @Nullable 
     @Override 
     protected Bundle getLaunchOptions() { 
      Bundle initialProps = new Bundle(); 
      initialProps.putString("SOME_VARIABLE_1", BuildConfig.SOME_VARIABLE_1); 
      initialProps.putString("SOME_VARIABLE_2", "some variable 2 value"); 
      return initialProps; 
     } 
    }; 
} 
+0

非常棒!应该补充说,你需要在顶部添加'import com.facebook.react.ReactActivityDelegate;'并且默认情况下'@ Nullable'在RN中不可用。我只是放弃了它,假设它意味着我只需要总是传递一个值。 – ssomnoremac

+0

您可以在回复中添加@ssomnoremac评论吗?他们很容易看不见 – Thibaut

这里所有的答案显得有点过时了。有了React-Native 0.42,这对我有用。

在您的活动(不应用程序)来实现这个目的

@Override 
protected ReactActivityDelegate createReactActivityDelegate() { 
    return new ReactActivityDelegate(this, "My Cool App") { 
     @Nullable 
     @Override 
     protected Bundle getLaunchOptions() { 
      Bundle bundle = new Bundle(); 
      if(MainActivity.this.port != null) { 
       bundle.putInt("port", MainActivity.this.port); 
      } 
      return bundle; 
     } 
    }; 
} 

显然替换任何你想传递给你的主要的道具“端口”响应机组件