创建React项目

1. create-react-app 项目名称

2.关键文件夹：public 和 src

public中编写index.html代码，例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="root"></div>
</body>
<style>
  *{
    padding: 0;
    margin: 0;
  }
</style>
</html>

src中编写index.js 和 App.js

index.js文件：

//引入react核心库
import React from "react";
//引入react-dom
import ReactDOM from "react-dom";
//引入App组件
import App from './App'
//渲染App到页面
ReactDOM.render(<App/>,document.getElementById('root'))

App.js文件：

import React from 'react'
import './App.css'
import Header from "./compontents/Header/Header"  //外部引入的组件

class App extends React.Component {
  render() {
    return (
      <div>
          <Header />   //引入的组件
      </div>
    )
  }
}
export default App;

以上就是react基本文件代码

posted @ 2022-01-06 09:27  无何不可88  阅读(360)  评论(0)    收藏  举报