166浏览

0评论

React组件的生命周期详细描述

目录一、什么是生命周期二、装载过程1、constructor2、render3、componentWillMount和componentDidMount三、更新过程1、componentWillReceiveProps（nextProps）2、shouldCompo...

• 2023-01-05

147浏览

0评论

react之组件通信详解

目录父组件与子组件通信子组件与父组件通信跨组件通信祖先子孙兄弟节点通信总结父组件与子组件通信 父组件将自己的状态传递给子组件，子组件当做属性来接收，当父组件更改自...

• 2023-01-05

120浏览

0评论

react组件中的constructor和super知识点整理

1、react中用class申明的类一些小知识如上图：类Child是通过class关键字申明，并且继承于类React。A、Child的类型是？ typeofChild === 'function' ， 其实就相当于ES5用function申...

• 2023-01-05

270浏览

0评论

React-Native之截图组件react-native-view-shot的介绍与使用小结

目录一、现象二、解决三、总结：一、现象1、需求：把某展示页面进行截取保存到相册、并可进行以海报的形式分享出去；2、支持iOS和安卓二、解决1、安装： npm i --save react-native...

• 2023-01-05

178浏览

0评论

详细谈谈React中setState是一个宏任务还是微任务

目录前言面试官的问法是否正确？§React 是如何控制 setState 的 ？§未来会有异步的 setState§总结前言最近有个朋友面试，面试官问了个奇葩的问题，也就是我写在标题上的这个问题...

• 2023-01-05

131浏览

0评论

React实现二级联动效果(楼梯效果)

本文实例为大家分享了React实现二级联动效果的具体代码，供大家参考，具体内容如下模仿饿了么实现一个二级联动的效果；import "../css/Leftrightlinkage.less";import React, { C...

• 2023-01-05

121浏览

0评论

React实现二级联动的方法

本文实例为大家分享了React实现二级联动的具体代码，供大家参考，具体内容如下实现效果： 普通h5页，图片我进行了裁剪，把用户那部分删掉了，不过也不影响说明大体思路就是把数据接口从...

• 2023-01-05

124浏览

0评论

react+axios实现github搜索用户功能(示例代码)

加载请求成功请求失败在文件路径点击cmd 回车
首先把服务器打开 npm startapp.jsimport React, { Component } from 'react'import "./App.css"import Header from './conom...

• 2023-01-05

167浏览

0评论

React之Hooks详解

目录什么是钩子（hooks）类组件函数组件为什么创造Hooks总结什么是钩子（hooks） 消息处理的一种方法, 用来监视指定程序 函数组件中需要处理副作用，可以用钩子把外部代码“钩...

• 2023-01-05

122浏览

0评论

React从Class方式转Hooks详解

目录React Hooks前言Why Hooks ？For ClassFor FunctionClass & Hooks 对比Hooks如何保存组件状态和使用生命周期？1、useState：让函数具有维持状态的能力2、useEffect：执行副作用...

• 2023-01-05

112浏览

0评论

React 原理详解

目录1.setState() 说明1.1 更新数据1.2 推荐语法1.3 第二个参数2.JSX 语法的转化过程3.组件更新机制4.组件性能优化4.1 减轻 state4.2 避免不必要的重新渲染总结1.setState(...

• 2023-01-05

161浏览

0评论

基于React-Dropzone开发上传组件功能(实例演示)

这次我要讲述的是在React-Flask框架上开发上传组件的技巧。我目前主要以React开发前端，在这个过程中认识到了许多有趣的前端UI框架——React-Bootstrap、Ant Design、Materia...

• 2023-01-05

143浏览

0评论

react分页显示数据的方法

目录父组件listBox列表组件List按钮组件PageButton去年年底，尝试着用react写个组件化的页面!里面有一个list页面弄了一下数据的分页展示展示一下主要三个组件：父组件listBox、...

• 2023-01-05

161浏览

0评论

简析React Native startReactApplication 方法

在 React Native 启动流程简析 这篇文章里，我们梳理了 RN 的启动流程，最后的 startReactApplication 由于相对复杂且涉及到最终执行前端 js 的流程，我们单独将其提取出来，独立成...

• 2023-01-05

144浏览

0评论

浅析React 对state的理解

如何定义复杂组件（类组件）与简单组件（函数组件）？ 是否具有状态（state）引出问题，什么是状态？举个例子，今天考试，考砸了，因为我状态不好，是状态影响了我的行为。
组件中的状态，驱动了页面...

• 2023-01-05

113浏览

0评论

React实现二级联动(左右联动)

本文实例为大家分享了React实现二级联动的具体代码，供大家参考，具体内容如下js代码import { Component } from 'react'import './linkage.less'class Linkage extends Compone...

• 2023-01-05

177浏览

0评论

React全局状态管理的三种底层机制探究

目录前言propscontextstate总结前言现代前端框架都是基于组件的方式来开发页面。按照逻辑关系把页面划分为不同的组件，分别开发不同的组件，然后把它们一层层组装起来，把根组件...

• 2023-01-05

381浏览

0评论

React+ts实现二级联动效果

本文实例为大家分享了React+ts实现二级联动效果的具体代码，供大家参考，具体内容如下.tsx文件import { Component, createRef} from 'react' import './index.less' interface...

• 2023-01-05

198浏览

0评论

React项目中axios的封装与API接口的管理详解

目录前言安装引入环境的切换请求拦截响应拦截api的统一管理总结前言
在react项目中，和后台交互获取数据这块，我们通常使用的是axios库，它是基于promise的http库，可运行在浏览器...

• 2023-01-05

133浏览

0评论

React实现组件全屏化的操作方法

介绍本文基于React+antd，给大家演示一个完整的全屏demo。起因是开发今天给我提了一个sql编辑器输入框比较小，不支持放大，不太方便。希望能够全屏显示，联想到自己以后可能也会需...

• 2023-01-05

141浏览

0评论

浏览器中视频播放器实现的基本思路与代码

目录前言浏览器中的音视频知识总结视频编码
封装格式
音视频标签
常用属性
常用事件
常用方法整体思路如下代码实现总结前言自定义个播放器，组件都是用的原生的，所以有点丑，重...

• 2023-01-05

125浏览

0评论

react实现页面水印效果的全过程

目录前言1.使用示例2.实现过程3.组件代码总结前言1.为什么选用svg 而不是cavans？因为cavans 在高分辨率屏幕下，需要根据 devicePixelRatio做宽高的适配，不然就会很模糊，而svg是...

• 2023-01-05

151浏览

0评论

React 首页加载慢问题性能优化案例详解

学习了一段时间React，想真实的实践一下。于是便把我的个人博客网站进行了重构。花了大概一周多时间，网站倒是重构的比较成功，但是一上线啊，那个访问速度啊，是真心慢，慢到自己都不...

• 2023-01-05

141浏览

0评论

五分钟教你了解一下react路由知识

目录什么是路由纯组件的基本使用纯组件使用的注意点路由的基本初体验HashRouter和BrowserRouterLink组件和NavLink组件Route和Switch组件路由传参什么是路由
简单的说就是根...

• 2023-01-05

159浏览

0评论

JavaScript中的useRef 和 useState介绍

目录1、useState hook2、useRef hook3、useRef 与 useState4、何时使用 Refs 和 States1、useState hookuseState 是一个内置的 React hook，它允许您将信息作为状态存储在变...

• 2023-01-05

124浏览

0评论

react+antd.3x实现ip输入框

本文实例为大家分享了react+antd.3x实现ip输入框的具体代码，供大家参考，具体内容如下表现形式如下：js+html/** * zks 2021 10 26 * ip输入框，作用于新建与修改虚拟子网 * 使用...

• 2023-01-05

120浏览

0评论

关于React中setState同步或异步问题的理解

目录1. setState同步？异步？2. 表现为异步1. React 合成事件2. 生命周期函数3. 表现为同步1. 原生事件2. setTimeout4. setState的第二个参数1. setState同步？异步？
在 React 的...

• 2023-01-05

156浏览

0评论

react的context和props详解

目录一、context1. 使用场景2. 使用步骤3. 总结二、props深入1. children 属性2. props 校验3. props校验使用步骤4. props校验约束规则5. props默认值总结一、context1. 使...

• 2023-01-05

107浏览

0评论

React Fragment介绍与使用详解

目录前言Fragments出现动机React Fragment介绍与使用<React.Fragment> 与 <>区别前言
在向 DOM 树批量添加元素时，一个好的实践是创建一个document.createDocumentFragment，先...

• 2023-01-05

118浏览

0评论

React Router 5.1.0使用useHistory做页面跳转导航的实现

目录1.使用withRouter组件2、使用Route标签ReactRouter5.1.0使用useHistory在React Router v4中 可以使用 withRouter组件 使用标签1.使用withRouter组件withRouter组...

• 2023-01-05

117浏览

0评论

教你在react中创建自定义hooks

一、什么是自定义hooks逻辑复用 简单来说就是使用自定义hook可以将某些组件逻辑提取到可重用的函数中。 自定义hook是一个从use开始的调用其他hook的Javascript函数...

• 2023-01-05

105浏览

0评论

浅谈python的函数知识

目录函数参数的两大分类位置参数可变长参数名称空间总结函数参数的两大分类形式参数 函数定义阶段括号所写的参数实际参数 函数调用阶段括号内传入的参数形参与实参的关系 ...

• 2023-01-05

120浏览

0评论

React通过conetxt实现多组件传值功能

该功能实现效果类似于vue的provide/inject
而React可通过context进行完成定义一个公共的文件context/Theme.jsximport { createContext } from 'react';const theme = creat...

• 2023-01-05

137浏览

0评论

聊聊React onClick 传递参数的问题

背景说明在下图这样的列表中，点击删除按钮需要执行删除操作 列表产生： { title: '操作', dataIndex: 'rowguid', key: 'rowguid', render: (text, record) => ( ...

• 2023-01-05

159浏览

0评论

React创建组件的的方式汇总

目录1. 使用函数创建组件2. 使用类创建组件3. 抽离为独立JS文件1. 使用函数创建组件　　函数组件：使用JS的函数(或箭头函数)创建的组件　　约定1：函数名称必须以大写字母开头...

• 2023-01-05

101浏览

0评论

详解React的组件通讯

目录组件通讯介绍内容三种方式小结组件通讯-父传子内容：核心代码子组件接收数据组件通讯-子传父思路步骤核心代码小结组件通讯-兄弟组件思路核心代码组件通讯 -跨级组件通讯...

• 2023-01-05

124浏览

0评论

如何创建自己的第一个React 页面

目录Rract是啥？背景 React脚手架JSX是什么Rract是啥？React 是用于构建用户界面的 JavaScript 库构建用户界面. User Interface，对咱们前端来说，简单理解为：HTML 页面javscrtipt库...

• 2023-01-05

121浏览

0评论

关于React中使用window.print()出现页面无响应问题解决记录

目录一、问题背景：二、问题原因： 三、问题解决：总结：一、问题背景：window.print()页面打印出现页面无响应看了网上很多办法都是让用window.location.reload(),对于这个解决方案不...

• 2023-01-05

244浏览

0评论

React手写tab切换问题

父文件import React, { useState } from 'react';// import Module1 from './Module1';// import Module2 from './Module2';// import Module3 from './Module3';// import...

• 2023-01-05

141浏览

0评论

详解react hooks组件间的传值方式(使用ts)

目录父传子子传父跨级组件(父传后代)父传子通过props传值，使用useState来控制state的状态值父组件 Father.tsx里：

子组件 Child.tsx里：
展示效果：
子传父跟react的方式一样，像子...

• 2023-01-05

131浏览

0评论

详解React 和 Redux的关系

目录一、redux和react的关系二、react多组件共享三、redux的三个核心概念1、store2、action （动作）3、reducer （纯函数）总结文档： Redux中文文档Redux 官方文档对 Redux 的定义是...

• 2023-01-05

206浏览

0评论

引入代码检查工具stylelint实战问题经验总结分享

目录前言正文1. 安装stylelint2. 配置文件3. 使用stylelint踩坑点1：4. 配置规则5. 忽略lint文件6. 自动格式化 插件踩坑集锦7. commit检测前言团队合作时，当每个人的代码都拥...

• 2023-01-05

406浏览

0评论

React国际化react-i18next详解

简介react-i18next 是基于 i18next 的一款强大的国际化框架，可以用于 react 和 react-native 应用，是目前非常主流的国际化解决方案。i18next 有着以下优点： 基于i18next不...

• 2023-01-05

135浏览

0评论

React组件间通信的三种方法（简单易用）

目录一、父子组件通信二、跨级组件通信1、逐层传值2、跨级传值三、兄弟（无嵌套）组件通信四、路由传值五、Redux React知识中一个主要内容便是组件之间的通信，以下列举几种常用...

• 2023-01-05

138浏览

0评论

基于CSS实现MaterialUI按钮点击动画并封装成 React 组件

前言作为一个前端框架的重度使用者,在技术选型上也会非常注意其生态和完整性.笔者先后开发过基于vue,react,angular等框架的项目,碧如vue生态的elementUI, ant-design-vue,...

• 2023-01-05

125浏览

0评论

react 路由Link配置详解

1、Link的to属性
(1)放置路由路径
(2)放置对象,且为规定格式
{pathname:"/xx",search:'&#63;键值对',hash:"#xxx",state:{键值对}}
会自动将pathname、search、hash拼接在ur...

• 2023-01-05

130浏览

0评论

浅谈React多个setState会调用几次

目录1. 两个setState，调用几次？2. 两个setState，调用的是哪一个？3. 两个setState放在setTimeout中？4. 总结1. 两个setState，调用几次？如下代码所示，state中有一个count。对按钮绑定...

• 2023-01-05

122浏览

0评论

浅谈React双向数据绑定原理

目录什么是双向数据绑定实现双向数据绑定数据影响视图视图影响数据如果已经学过Vue，并且深入了解过Vue的双向数据绑定的话，就会明白 Vue 2.0 双向数据绑定的核心其实是通过Obj...

• 2023-01-05

176浏览

0评论

React中10种Hook的使用介绍

目录React Hook是什么？React目前提供的Hook1.useState2.useEffect & useLayoutEffect3.useMemo & useCallback4.useRef5.useContext6.useReducerReact Hook是什么？
React官网...

• 2023-01-05

169浏览

0评论

JS跨域解决方案react配置反向代理

跨域解决方案  jsonp(模拟get)CORS(跨域资源共享)代理iframepostMessagewindow.nameWebSocketreact的代理实现跨域在配置在src/setupProxy.js文件，并通过npm安装http-proxy-...

• 2023-01-05