React第一个项目

运行效果:

知识讲解:

组件:先定义后使用,用户界面的构成要素(标签、css和JavaScript)

定义组件

导出组件:export default 前缀是JavaScript标准语法

定义函数:function Title() {} 定义为Title的JavaScript函数,注意:函数名一定要大写字母开头和HTML标签做个区别

添加标签:return语句可以一行显示,若多行显示需要一对括号包裹()

使用组件:

在导出函数中return中使用即可

App.js 代码:

javascript 复制代码
// 在下面写你的组件
function Title(){
  return (
    <div>
      <span>你好!!</span>
      <br/>
      <span>我好!!!</span>
    </div>
  )  //组件返回标签的JavaScript语法被称 JSX
}

export default function MyBotton(){
  return <Title></Title>
}
相关推荐
ZC跨境爬虫3 分钟前
跟着 MDN 学 HTML day_12:(HTML网页图片嵌入)
前端·javascript·css·ui·html
光影少年9 分钟前
reeact虚拟DOM、Diff算法原理、key的作用与为什么不能用index
前端·react.js·掘金·金石计划
用户0595401744614 分钟前
大模型记忆存储踩坑实录:LangChain 的 ConversationBufferMemory 让我排查了 6 小时
前端·css
是上好佳佳佳呀21 分钟前
【前端(十二)】JavaScript 函数与对象笔记
前端·javascript·笔记
你真的快乐吗36 分钟前
@fuxishi/svg-icon:一个 Vue 3 svg本地图标+iconify图标组件库,让图标管理不再头疼
前端·vue.js·typescript
Rkgua42 分钟前
ESModule和Commonjs模块的区别
前端·javascript
江南十四行42 分钟前
ReAct Agent 基本理论与项目实战(二)
前端·react.js·前端框架
用户600071819101 小时前
【翻译】React 如何乱序流式输出 UI,却仍保持最终顺序
前端
江南十四行1 小时前
AI Agent应用类型及Function Calling开发实战(三)
服务器·前端·javascript
yqcoder1 小时前
JavaScript 数据类型全景图:从基础到进阶
开发语言·javascript·ecmascript