Reactjs 组件移动到新文件时，React/Webpack应用程序元素无效？

我有一个非常简单的React应用程序，用于处理以下Web包：

export const Row = (props) => {
  return <h1>This is a name</h1>;
};

export default class App extends React.Component {
  render() {
    return (
      <Row />
    )
  }
}

但是我得到了这个错误：

warning.js?0260:36 Warning: React.createElement: 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. Check the render method of `App`.

---

似乎您必须将React导入子文件并导出新模块：

import React from 'react';

export const Row = (props) => {
  return <h1>This is a name</h1>;
};

module.exports = Row;

从“React”导入React；
导出常量行=（道具）=>{
返回这是一个名称；
};
module.exports=行；

您正在将其导出为名为导出的

，因此需要按如下方式导入：

import {Row} from './row';

const Row = (props) => {
  return <h1>This is a name</h1>;
};

export default Row;

如果要将

导入为默认值，则首先需要导出功能默认值，如下所示：

import {Row} from './row';

const Row = (props) => {
  return <h1>This is a name</h1>;
};

export default Row;

有关的更多信息，请查看本文