Javascript 将功能中的道具提取到React中的组件中

我正在编写一个react组件，我正在尝试将应用程序函数中的名称提取到Welcome中，因此应该显示Hello，Sara/Hello，Jone和Hello，David。目前它只显示为Hello，而不是Hello后面的name

我正在同一文件夹的其他主文件中导入此组件

这是密码

import React from "react";
import ReactDOM from "react-dom";

class Welcome extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      value: ""
    };
  }
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}

function App() {
  return (
    <div>
      <Welcome name="Sara" />
      <Welcome name="Jone" />
      <Welcome name="David" />
    </div>
  );
}

export default Welcome;

从“React”导入React；
从“react dom”导入react dom；
类欢迎扩展React.Component{
建造师（道具）{
超级（道具）；
此.state={
值：“”
};
}
render（）{
返回Hello，{this.props.name}；
}
}
函数App（）{
返回(
);
}
出口默认值欢迎；

组件仅呈现

Hello，

的原因是您当前正在从模块导出

Welcome

组件

改为导出

App

组件，它将按预期工作

export default App;

---

您正在导出

欢迎

组件。您不想导出

应用程序

并使用它吗？因为您要导出欢迎组件，所以需要导出应用程序组件，

导出默认应用程序我认为@Tholle是正确的，因为代码运行良好，否则：嗨，Tholle，你是正确的，谢谢