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

相关推荐
房开民3 小时前
c++总结
java·开发语言·c++
毕设源码-赖学姐3 小时前
【开题答辩全过程】以 基于Java的医院器材管理系统的设计与实现为例,包含答辩的问题和答案
java·开发语言
float_com4 小时前
【java常用API】----- Arrays
java·开发语言
不会写DN4 小时前
PHP 中的文件读写与上传
android·开发语言·php
LuckyTHP5 小时前
迁移shibboleth java获取shibboleth用户信息
java·开发语言
客卿1235 小时前
数论===质数统计(暴力法,)
java·开发语言
Σίσυφος19005 小时前
C++ 多肽经典面试题
开发语言·c++·面试
终端鹿5 小时前
Vue3 模板引用 (ref):操作 DOM 与子组件实例 从入门到精通
前端·javascript·vue.js
csdn_aspnet6 小时前
C# 求n边凸多边形的对角线数量(Find number of diagonals in n sided convex polygon)
开发语言·算法·c#
qq_254674416 小时前
Docker 中的 镜像(
开发语言