使用 System.import 异步加载 react 组件

Question

我正在尝试异步加载 React 组件，但它不起作用。这是我的代码：

import React, { Component } from 'react'
//import Home from '$components/Home/Home'
/**
 * Home Page container, loads at `/` route.
 */
class HomeContainer extends Component {
  /**
   * React Lifecycle Event: Renders Home Page View
   * @return {JSX}  Calls Home Component to Render the page
   */
  render() {
    return System.import('javascripts/components/Home/Home')
      .then(function (Home) {
        return <Home />
      })
  }
}
export default HomeContainer

不知道出了什么问题。请让我知道如何解决这个问题。

Answer 1

React 渲染器只会在适当的时候执行。

您可以改用require在 render 函数中导入文件。

const component = require('component');

例：

https://github.com/erikras/react-redux-universal-hot-example/blob/master/src/components/SurveyForm/SurveyForm.js#L50