首页 文章

React组件简单渲染

提问于
浏览
0

我是新手做出反应并遵循教程https://facebook.github.io/react/docs/components-and-props.html

我有下面的代码 . 我不明白为什么它不会呈现内容 .

function Welcome(props) {
  return <h1>Hello, {props.surname}</h1>;
}

function App(props) {
  return (
    <div>
      <Welcome surname = {props.surname} />
      <Welcome surname = {props.surname} />
      <Welcome surname = {props.surname} />
    </div>
  );
}

function myApp(){
  return (
    <div>
      <App surname = "Simon" />
    </div>
  );
}

ReactDOM.render(
  <myApp/>,
  document.getElementById('root')
);

我跟着这个类似的例子:https://codepen.io/gaearon/pen/KgQKPr?editors=0010

我唯一不同的是在顶部添加一个不同的组件并更改道具数据 .

如果我遗失任何事情,请告诉我 .

1 回答

  • 3

    反应成分的第一个字母应该是资本 . 所以将你的 myApp 转换为 MyApp

    function MyApp(){
      return (
        <div>
          <App surname = "Simon" />
        </div>
      );
    }
    
    ReactDOM.render(
      <MyApp/>,
      document.getElementById('root')
    );
    

相关问题