javascript - 如何在Javascript/ReactJs/React Native中动态导入模块

我想通过 Prop 从设置的路径 importPath 动态导入模块。

var importPath;

class MainComponent extends Component {
    state = {}
    render() {
        // Set var importPath = "path_to_module here;"
        // importPath = this.props.myModulePath
        return (
            <ComponentToImport myComponentPath="./ToastExample" />);
    }
}

export default MainComponent;

然后:

class ComponentToImport extends Component {
    ToastExample: (async () => {
        await import (this.props.revPath)
    })()

    async sayHiFromJava() {
        this.state.ToastExample.showJ('Awesome', ToastExample.SHORT);
    }

    render() {
        return (<ToastExample />);
    }
}

我该怎么办？

谢谢大家。

如何将ToastExample中的import ToastExample from importPath;附加到await import("importPath");，以便可以return(<ToastExample />);
更新

我努力了 :

class ComponentToImport extends Component {
    ToastExample: (async () => {
        await import (this.props.revPath)
    })()

    async sayHiFromJava() {
        this.state.ToastExample.showJ('Awesome', ToastExample.SHORT);
    }

    render() {
        return (<ToastExample />);
    }
}

但我得到了错误:

error: bundling failed: index.js: index.js:Invalid call at line 28: import(_this.props.myComponentPath)

最佳答案

我想这是这样的:

import("importPath").then(() => {
    // your code
});

要么

await import("importPath");

// your code