将项目添加到Android React Native Developer菜单

Question

在React Native中，进行开发构建时，您可以摇动设备或使用菜单按钮打开开发人员菜单。如何将其他自定义项添加到此菜单？我还没有找到任何关于添加另一项的文档，但我认为从“开发”菜单中选择“在服务器环境（开发、产品等）之间切换”会非常方便，而不是针对每个环境进行单独的构建测试。

Answer 1

DevSupportManager类可以为您完成这项工作。您可以通过其ReactInstanceManager从您的ReactNativeHost实例获取它：

ReactInstanceManager reactInstanceManager = reactNativeHost.getReactInstanceManager();
DevSupportManager devSupportManager = reactInstanceManager.getDevSupportManager();

有了它，添加一个自定义开发选项，如下所示：

devSupportManager.addCustomDevOption("Custom dev option", new DevOptionHandler() {
    @Override
    public void onOptionSelected() {
        Toast.makeText(MainActivity.this, "Hello from custom dev option", Toast.LENGTH_SHORT).show();
    }
});

你从哪里获得你的ReactNativeHost实例首先取决于你是如何构建你的应用程序的。如果您使用react native init创建应用程序，那么您的主要应用程序类将包括：

@Override
public ReactNativeHost getReactNativeHost() {
    return mReactNativeHost;
}

...你可以打电话。

我这里有一个完整的样品；看看主要活动。OnCreate：

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    MainApplication application = (MainApplication) getApplication();
    ReactNativeHost reactNativeHost = application.getReactNativeHost();
    ReactInstanceManager reactInstanceManager = reactNativeHost.getReactInstanceManager();
    DevSupportManager devSupportManager = reactInstanceManager.getDevSupportManager();
    devSupportManager.addCustomDevOption("Custom dev option", new DevOptionHandler() {
        @Override
        public void onOptionSelected() {
            Toast.makeText(MainActivity.this, "Hello from custom dev option", Toast.LENGTH_SHORT).show();
        }
    });
}

Answer 2

您可以使用DevSettingsaddMenuItem函数在React Native developer菜单中添加项

在你的mainApp.js组件中，写

import { DevSettings } from 'react-native';

//...

useEffect(() => {
    // componentDidMount

    // Add our toggle command to the menu
    DevSettings.addMenuItem('Toggle Storybook', () => {
        // Perform your logic here
    });
}, []);