使用react制作简单购物车

~柠凉id

已于 2023-04-01 16:37:45 修改

阅读量984

点赞数

分类专栏：前端 JavaScript 文章标签： react.js javascript 前端

于 2022-12-10 14:12:53 首次发布

本文链接：https://blog.csdn.net/m0_71933813/article/details/128264601

版权

开发React必须依赖三个库

1.react：包含react所必须的核心代码

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

3.babel：将jsx转换成React代码的工具

组件化方法

1）.编写React的script代码中，必须添加 type="text/babel"，作用是可以让babel解析jsx的语法
2）.使用ReactDOM.createRoot创建一个根节点用变量接收，把内容渲染到root上

3）.定义组件
4）.要渲染的根组件

5）.然后再定义class类（定义的组件名必须要大写），继承React.Component

6）.接着步骤5，里面有一个构造函数（子类继承父类）相当于data在构造函数中的state属性，this.state = {定义的数据}

7）.接着步骤6，render是渲染函数，相当于vue中的template（模板）

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>购物车案例</title>
		<style>
			table {
				border-collapse: collapse;
				text-align: center;
			}

			thead {
				background-color: #

最低0.47元/天解锁文章

~柠凉id

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
使用react制作简单购物车

开发React必须依赖三个库 1.react：包含react所必须的核心代码 2.react-dom：react渲染在不同平台所需要的核心代码 3.babel：将jsx转换成React代码的工具组件化方法1）.编写React的script代码中，必须添加 type="text/babel"，作用是可以让babel解析jsx的语法2）.使用ReactDOM.createRoot创建一个根节点用变量接收，把内容渲染到root上3）.定义组件4）.要渲染的根组件5
复制链接

扫一扫