React：Function Component

最新推荐文章于 2025-01-27 11:27:43 发布

原创最新推荐文章于 2025-01-27 11:27:43 发布 · 447 阅读

0 ·

CC 4.0 BY-SA版权

React 专栏收录该内容

54 篇文章

订阅专栏

本文详细介绍了如何在React中创建一个简单的组件Person，并将其导入到App组件中进行使用。通过具体的代码示例，展示了组件的定义、导出及在主应用中的引入过程。

Component

component文件：Person.js;

import React from 'react';

const person = ()=>{
  return(
    <p>I Am a person!</p>
  )
};

export default person;

将component导入app的jsx中

import React from 'react';
import './App.css';
import Person from './Person/person';

function App() {
  return (
    <div className="App">
      <h1>Hi i am a React App!</h1>
      <p>It is working!</p>
      <Person />
    </div>
  );
  //return React.createElement('div',{className:'App'},React.createElement('h1',null,'Hi I\'m a React App'));
}

export default App;