欢迎光临散文网 会员登陆 & 注册

丁鹿学堂:前端学习react指南(react的数据绑定和修改)

2023-07-31 22:11 作者:丁鹿学堂前端培训  | 我要投稿

在html中使用react

今天跟大家分享react的基础语法。

我们采用最简单的方法,就是在html中引入react

因为一上来就使用脚手架的话,很多配置大家不一定清楚。

而在html中使用react的话,可以直接去学习react最基本的语法。

这是零基础学习react的最佳实践。

引入react的依赖

react也是js库,所以我们在使用的时候需要引入react的依赖

react依赖的是三个包

1 react 包含react所必须的代码

2 react-dom react在渲染不同平台所需要的代码

3 babel 讲jsx转换成react代码的工具 ,jsx是react编写代码的采用的一种语法,默认浏览器是不识别的,需要通过babel去编译成浏览器识别的js代码。

注意:

react的包引入必须在react-dom前面,babel则没有顺序要求。

react实现hello world

我们通过一个小案例,来入门react,知识点包含:dom渲染,事件,修改数据

注意:

1react18和react18之前的一些语法是不一样的,我们使用最新的库和写法。

2jsx语法中,所有的变量都是通过{} 的形式写在dom中的

3 jsx中,点击事件使用onClick去绑定。


丁鹿学堂:前端学习react指南(react的数据绑定和修改)的评论 (共 条)

分享到微博请遵守国家法律