React
关注
分享
扫一扫
文章平均质量分 58
React
九宫格输入法
正在码代码ing
展开
-
11.React 类式组件
创建类式组件： 代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>类式组件</title></head><body> <!-- 准备好一个“容器” --> <div id="test"></div> <!-- 引入react核心库原创 2021-07-27 10:04:35 · 141 阅读 · 0 评论 -
10.React 复习类相关知识
ES6中的知识点，直接上代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>类的基本知识</title></head><body> <script type="text/javascript" > /* 总结： 1.类中的构造器不原创 2021-07-23 17:26:28 · 183 阅读 · 0 评论 -
9.React 函数式组件
创建组件： 组件是用来实现局部功能效果的代码和资源的集合(html/css/js/image等等) 写个函数进行渲染<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>1_函数式组件</title></head><body> <!-- 准备好一个“容器” --> <di原创 2021-07-23 17:24:43 · 211 阅读 · 0 评论 -
8.React 开发者工具调试
开发者工具安装： 压缩包解压后，文件夹内的文件如下： 打开谷歌游览器 - 更多工具 - 扩展程序 - 加载已解压的扩展程序 - 选择文件夹 安装成功： 点击右上角的扩展程序 - 选中图钉，可以把工具固定在界面 打开之前写的html，看箭头 发现右上角的图标亮了，是红色的上面还有个小虫子，这个表示当前处于开发的状态并不是打包后的 那么打包部署运行的图标是什么样子的呢，以美团举例，这种的图标才是正常的作用： 打开之前写的html，审查元素F12，发现多了两个按钮：原创 2021-07-23 17:18:40 · 382 阅读 · 0 评论 -
7.React 模块与组件、模块化与组件化的理解
模块：理解：向外提供特定功能的js程序, 一般就是一个js文件为什么要拆成模块：随着业务逻辑增加，代码越来越多且复杂。作用：复用js, 简化js的编写, 提高js运行效率组件：理解：用来实现局部功能效果的代码和资源的集合(html/css/js/image等等)为什么要用组件： 一个界面的功能更复杂作用：复用编码, 简化项目编码, 提高运行效率模块化： 当应用的js都以模块来编写的, 这个应用就是一个模块化的应用组件化： 当应用是以多组件的方式实现, 这个应用就是一个组件化原创 2021-07-23 17:14:32 · 210 阅读 · 0 评论 -
6.React jsx小练习
需求: 动态展示如下列表案例： 根据之前所学，先编写一个静态的案例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jsx小练习</title></head><body> <!-- 准备好一个“容器” --> <div id="test"></div>原创 2021-07-23 17:09:40 · 191 阅读 · 0 评论 -
5.React jsx语法规则
1.JSX： 1.1、 全称: JavaScript XML 1.2、react定义的一种类似于XML的JS扩展语法2.案例：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jsx语法规则</title></head><body> <!-- 准备好一个“容器” -->原创 2021-07-23 17:04:45 · 237 阅读 · 0 评论 -
4.React 虚拟DOM与真实DOM
1.虚拟DOM：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>3_虚拟DOM与真实DOM</title></head><body> <!-- 准备好一个“容器” --> <div id="test"></div> <!-- 引入react核心原创 2021-07-23 16:53:08 · 352 阅读 · 0 评论 -
3.React 虚拟DOM的两种创建方式
1.使用jsx创建虚拟DOM：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>1_使用jsx创建虚拟DOM</title></head><body> <!-- 准备好一个“容器” --> <div id="test"></div> <!-- 引原创 2021-07-23 16:49:47 · 268 阅读 · 1 评论 -
2.React hello_react案例
React的依赖包： 1.babel.min.js：解析JSX语法代码转为JS代码的库 在进行import操作时游览器是无法直接解析的，还是需要借助babel从ES6转ES5。 React写的不是js而是jsx,jsx是在js的基础上提出了一些要求和语法，我们写的是jsx游览器只认js，那么同样需要需要借助babel从jsx转js。 2.react.development.js：React核心库 3.react-dom.development.js：提供操作DOM的react扩展库原创 2021-07-23 16:45:24 · 157 阅读 · 0 评论 -
1.React 简介
React的官网： 1.英文官网: https://reactjs.org/ 2.中文官网: https://react.docschina.org/React的描述： 1.用于动态构建用户界面的JavaScript库 2.程序的执行过程如下： 2.1、发送请求获取数据 2.2、处理数据（过滤、整理格式等） 2.3、操作DOM呈现页面 React只管第三步，将数据渲染为HTML视图(只关注于视图)JavaScript的痛点：document.getElementById原创 2021-07-22 12:17:06 · 950 阅读 · 2 评论