javascript - 反应原生创建模块 - 不变违规：元素

Question

我正在尝试创建一个简单的模块，我必须在其中打印带有消息的 textView 但它告诉我：

不变违规：元素类型无效：预期为字符串（用于内置组件）或类/函数（用于复合组件）但得到：未定义。

您可能忘记从定义它的文件中导出 ypur 组件，或者您可能混淆了默认导入和命名导入。检查“App”的渲染方法。

这是 RNFabProgress.java 模块的代码：

package ui.fabprogress;

import android.view.ViewGroup;
import android.widget.RelativeLayout;
import android.widget.TextView;

import com.facebook.react.uimanager.ThemedReactContext;
import com.facebook.react.uimanager.ViewGroupManager;

public class RNFabProgress extends ViewGroupManager<ViewGroup> {

    public static final String REACT_CLASS = "RNFabProgress";

    @Override
    public String getName() {
        return REACT_CLASS;
    }

    protected RelativeLayout createViewInstance(final ThemedReactContext reactContext) {

        /*final ViewGroup viewGroup = (ViewGroup) reactContext.getCurrentActivity().findViewById(android.R.id.content);
        viewGroup.setClipChildren(false);
        viewGroup.setClipToPadding(false);

        FrameLayout frameLayout = (FrameLayout) viewGroup.getChildAt(0);
        frameLayout.setClipChildren(false);
        frameLayout.setClipToPadding(false);*/

        /*LinearLayout.LayoutParams frameParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,
                LinearLayout.LayoutParams.WRAP_CONTENT);

        LinearLayout frame = new LinearLayout(reactContext);
        frame.setClipChildren(false);
        frame.setClipToPadding(false);

        FrameLayout firstView = new FrameLayout(reactContext);
        firstView.setLayoutParams(frameParams);

        firstView.setClipChildren(false);
        firstView.setClipToPadding(false);

        TextView text1 = new TextView(reactContext);
        text1.setHeight(250);
        text1.setBackgroundColor(Color.GRAY);
        text1.setText("Text 1sdasd");

        firstView.addView(text1);

        frame.addView(firstView);*/

        final RelativeLayout container = new RelativeLayout(reactContext);
        TextView textView = new TextView(reactContext);
        textView.setText("hello world");
        RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(960, 150);
        container.addView(textView, lp);

        return container;
    }
}

模块 index.js：

import { NativeModules } from 'react-native';
const { RNFabProgress } = NativeModules;
export default RNFabProgress;

应用 App.js

import RNFabProgress from 'react-native-fab-progress';
....
export default class App extends Component<Props> {
  render() {
    return (
      <View style={styles.container}>
      <RNFabProgress />
      </View>
    );
  }
}

我在哪里做错了？

标签： javascriptjavaandroidreactjsreact-native