react学习(1)

1:创建react项目

npx create-react-app react-basic

2:jsx

含义:是javascript和xml(html)的缩写,表示在js代码中编写html模版结构,是react中编写UI模版的方式。
优势:(1)HTML的声明式模版写法;(2)js的可编程能力
本质:jsx并不是标准的js语法,是js的扩展语法,浏览器本身不能识别,需要通过解析工具(babel)解析之后才能在浏览器中运行。

  • jsx中可以使用大括号{}来识别javascript中的表达式,比如常见的变量,函数调用,方法调用等。

  • jsx中列表渲染需要使用数组的map方法

    {list.map(item=>
  • {item.name}
  • )}
  • jsx中的条件渲染:可以通过逻辑与运算符&&或者三目运算符(?:)来实现基础的条件渲染
{flag&&如果falg为true,就会展示这个内容}
{loading?Loading.....:加载完成。}
  • jsx中的复杂条件渲染:自定义函数+if判断
{getArticleTemp()}
function getArticleTemp(){ if(articleTemp === 0){ return
无图模式
}else if(articleTemp === 1){ return
单图模式
}else { return
多图模式
} }
其他

ts学习(4)

2024-12-9 10:40:01

其他

react学习(5)

2024-12-9 10:40:07

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
搜索