Question

我正在尝试动态包含模块，但我不断收到错误消息：

Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check the render method of `HelloWorld`.

This error is located at:
    in HelloWorld (at renderApplication.js:40)
    in RCTView (at AppContainer.js:101)
    in RCTView (at AppContainer.js:119)
    in AppContainer (at renderApplication.js:39)

这就是我的处理方式：

index.js

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

import {name as appName} from './app.json';

import Components from './ComponentIndex';

class HelloWorld extends React.Component {

    render() {
        const myComponentPath = this.props.myModulePath;
        console.log(">>> Path " + myComponentPath)

        const ComponentToRender = Components[myComponentPath];
        return <ComponentToRender/>
    }
}

AppRegistry.registerComponent(appName, () => HelloWorld);

ComponentIndex.js

let Components = {};

Components['./MyBaseComponent'] = require('./MyBaseComponent').default;

export default Components

console.log(">>> Path : " + this.props.myModulePath)打印出预期的传递路径，例如./MyBaseComponent，表示该路径不为空。如上所示，仅当我尝试从this.props.myModulePath设置路径时，才会发生错误。但是，只要我手动设置const myComponentPath = "./MyBaseComponent";

，它就可以正常工作

我在做什么错？

提前谢谢大家。

尝试动态加载React模块时发生错误

0 个答案: