react中如何使用import动态导入文件？

Question

let WebH5;
if (webFlag) {
WebH5 = './components/web/WebIndex';
} else {
WebH5 = './components/h5/HIndex';
}
import WebOrH5 from WebH5; // 会提示说WebH5应为字符串文本

Answer 1

使用React.lazy和React.Suspense配合动态加载import()

Answer 2

let WebH5;
if (webFlag) {
WebH5 = './components/web/WebIndex';
} else {
WebH5 = './components/h5/HIndex';
}

const WebOrH5 = require(WebH5);

Answer 3

let WebH5;
if (webFlag) {
WebH5 = require('./components/web/WebIndex');
} else {
WebH5 = require('./components/h5/HIndex');
}