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

相关推荐
似水এ᭄往昔1 分钟前
【C++】--二叉搜索树
开发语言·数据结构·c++
大道戏7 分钟前
互联网程序设计第12 讲 RMI 程序设计
java·开发语言·计算机网络
水木姚姚8 分钟前
C++程序创建(VS Code)
开发语言·c++
666HZ66611 分钟前
C语言——C++的引用
c语言·开发语言·c++
San30.12 分钟前
深入 JavaScript 原型与面向对象:从对象字面量到类语法糖
开发语言·javascript·ecmascript
皖南大花猪15 分钟前
Go 项目中使用 Casbin 实现 RBAC 权限管理完整教程
开发语言·后端·golang·rbac·casbin
源代码•宸17 分钟前
GoLang写一个火星漫游行动
开发语言·经验分享·后端·golang
小尧嵌入式18 分钟前
C++中的封装继承多态
开发语言·arm开发·c++
锂享生活22 分钟前
金句闪卡生成器
前端·javascript·react.js
csbysj202024 分钟前
Redis 配置详解
开发语言