React基础之项目创建

项目创建

create-react-app 项目名(小写)

运行

pnpm run start

在React中,使用的语法格式是jsx,也就是js与html相结合的形式

import logo from './logo.svg';

import './App.css';

function App() {

return (

<div className="App">

<header className="App-header">

<img src={logo} className="App-logo" alt="logo" />

</header>

</div>

);

}

export default App;

react中只能返回一个根元素

如果需要使用多个<div>,可以外部包一个整体的div标签,或是直接使用一个空标签来包含

import logo from './logo.svg';

import './App.css';

function App() {

return (

<>

<div className="App">

<header className="App-header">

<img src={logo} className="App-logo" alt="logo" />

</header>

</div>

<div></div>

</>

);

}

export default App;

react中需要标签的闭合

相关推荐
蔗理苦12 分钟前
2025-10-07 Python不基础 20——全局变量与自由变量
开发语言·python
-森屿安年-36 分钟前
C++ 类与对象
开发语言·c++
小蒜学长1 小时前
springboot基于javaweb的小零食销售系统的设计与实现(代码+数据库+LW)
java·开发语言·数据库·spring boot·后端
会开花的二叉树1 小时前
c语言贪吃蛇游戏开发
c语言·开发语言
韩立学长1 小时前
【开题答辩实录分享】以《C#大型超市商品上架调配管理系统的设计与实现》为例进行答辩实录分享
开发语言·c#
爱看书的小沐2 小时前
【小沐学WebGIS】基于Three.JS绘制飞行轨迹Flight Tracker(Three.JS/ vue / react / WebGL)
javascript·vue·webgl·three.js·航班·航迹·飞行轨迹
tao3556672 小时前
【Python刷力扣hot100】49. Group Anagrams
开发语言·python·leetcode
龙腾AI白云2 小时前
大模型-扩散模型(Diffusion Model)原理讲解(4)
开发语言
井柏然2 小时前
前端工程化—实战npm包深入理解 external 及实例唯一性
前端·javascript·前端工程化
爱吃小胖橘3 小时前
Lua语法(2)
开发语言·unity·lua