如何呈现Shoutem扩展

Question

我想知道如何呈现一些Shoutem扩展，为了简单起见，我打算将其呈现为我唯一的组件，如下所示：

import 'es6-symbol/implement';

import React from 'react';
import {
  AppRegistry,
  View
} from 'react-native';

import { AppBuilder } from '@shoutem/core';
import { NavigationBar } from '@shoutem/ui';
import { createStore } from 'redux';
import { Provider } from 'react-redux';

import extensions from './extensions.js';
import { screens } from './extensions/kevinyclu.restaurants/app/index';

const List = screens.List;
const store = createStore((state, action) => state);
const App = () => <Provider store={store}><View><List /></View></ Provider>;


// noinspection JSCheckFunctionSignatures
AppRegistry.registerComponent('Restaurant', () => App);

但这给了我一个错误，它说：

​

但是，如果我将const App = ...替换为执行shoutem configure时最初存在的代码

const App = new AppBuilder()
  .setExtensions(extensions)
  .setRenderNavigationBar(renderNavigationBar)
  .build();

那么一切都很好，所以我想知道如何使用Shoutem扩展？或者我完全理解不了这个扩展的要点？

Answer 1

您只需在Builder中添加一个屏幕即可。该流程在我们的入门文档中进行了解释。你创建一个扩展，创建一个带有快捷方式的屏幕，然后将其上传到Shoutem服务器，并将其安装在Builder上的一个应用程序中。

在此之后，您可以转到构建器中的应用程序，并通过单击Screens旁边的+按钮来添加新扩展的屏幕。您可以通过选择Custom类别轻松地找到您的新扩展。

请记住，安装新应用程序后，应在克隆应用程序的目录中运行shoutem configure。这将设置您在Builder上安装了新扩展后的新配置。

一些建议:如果你在Builder上卸载了一个扩展，最好完全重新克隆你的应用，因为shoutem configure不会从目录中删除该扩展，这可能会“隐藏”错误。例如，您可以从已卸载的扩展中导入某些内容，但不会出现错误，因为文件仍然存在，即使它们已卸载。