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中需要标签的闭合

相关推荐
Wang's Blog7 小时前
Java 项目实战:交友项目 - 用户体系集成总结
java·开发语言·交友
中科三方8 小时前
IPv6检测常见问题:AAAA记录检测不通过是什么原因?
开发语言·php
沫璃染墨9 小时前
从零入门计算机网络系列(十一):HTTP协议进阶——从重定向原理到GET/POST与Fiddler抓包
linux·服务器·开发语言·网络·c++·tcp/ip·html
刚入门的大一新生9 小时前
Linux-线程互斥
java·开发语言
香芋芋圆9 小时前
iD-editor 详解|OSM官方在线编辑器,基于D3.js的轻量地图编辑器
开发语言·javascript·编辑器
小熊恋旧10 小时前
Python 面向对象编程:方法、属性、继承与多态详解
开发语言·python
云边云科技_云网融合10 小时前
面向汽车零部件制造业场景的解决方案 | 70 秒:一台车下线的时间里,藏着五张网
开发语言·汽车·php
Evand J10 小时前
【PMSM滤波例程2】PMSM未知负载转矩观测EKF。MATLAB例程(负载增广EKF与实际仿真结果)。附下载链接
开发语言·matlab·电机
will_net10 小时前
apollo 站点部署&C#接入
开发语言·c#·apollo
晗夜未央11 小时前
任务队列反复失败,先分清重试、阻塞和结果待核对
开发语言·javascript