编程开发 - 教程之家

编程开发

分类导航：HTML/html5 CSS JavaScript PHP Python Java IOS .NET R语言 Android Go语言鸿蒙OS C类语言综合编程正则表达式

347浏览

0评论

React 中 setState 的异步操作案例详解

目录前言React 中的 setState 为什么需要异步操作？什么时候setState会进行同步操作？前言在使用state的时候，如果我们企图直接修改state中的某一个值之后直接打印（使用）他，就会发...

2023-01-05 20:41:36

221浏览

0评论

React状态管理Redux原理与介绍

目录一、Redux二、Redux的组成2.1 store2.2 state2.3 action2.4 reducer三、三大原则3.1 单一数据源3.2 State只读3.3 使用纯函数修改State四、基于Redux的TodoList五、reac...

2023-01-05 20:41:34

52浏览

0评论

React的生命周期函数初始挂载更新移除详解

目录概述constructor初始挂载更新移除概述在React中，生命周期函数指的是组件在某一个时刻会自动执行的函数constructor 在类或组件创建的时候被自动执行，我们可以说它是生命...

2023-01-05 20:41:31

327浏览

0评论

react如何向数组中追加值

目录react向数组中追加值react处理数组的值1. 追加数组的值2. 删除下标为index的值react向数组中追加值首先，渲染一个随机数，每个一秒变换一次，效果如下：代码如下：<!DOCTYPE html...

2023-01-05 20:41:29

45浏览

0评论

react实现动态选择框

本文实例为大家分享了react实现动态选择框的具体代码，供大家参考，具体内容如下小需求在工作中，我们也会碰到这种需求: 为了提高用户的体验，在搜索的时候，采用灵活查询。用户可以...

2023-01-05 20:41:27

142浏览

0评论

React封装全屏弹框的方法

本文实例为大家分享了React封装全屏弹框的具体代码，供大家参考，具体内容如下web开发过程中，需要用到弹框的地方很多，有时候，产品经理的原型是全屏弹框，而常用的组件库里封装的一般...

2023-01-05 20:41:25

53浏览

0评论

react实现Modal弹窗效果

本文实例为大家分享了react实现Modal弹窗效果的具体代码，供大家参考，具体内容如下一、Dialog.js文件import React, {useMemo, useEffect, useState} from 'react'import React...

2023-01-05 20:41:23

30浏览

0评论

react实现自定义拖拽hook

前沿最近发现公司的产品好几个模块用到了拖拽功能，之前拖拽组件是通过Html5 drag Api 实现的但体验并不是很好,顺便将原来的拖拽组建稍做修改，写一个自定义hook，方便大家使用拖...

2023-01-05 20:41:21

54浏览

0评论

React日期时间显示组件的封装方法

本文实例为大家分享了React日期时间显示组件的封装具体代码，供大家参考，具体内容如下时间日期展示器import ProtoType from 'prop-types';import { useState, useEffect } fro...

2023-01-05 20:41:10

49浏览

0评论

React路由中的redux和redux知识点拓展

目录路由中使用redux路由reducerRedux拓展state拓展action拓展静态action动态action异步action异步action中间件路由中使用redux在路由中使用redux只需要两步：第一步在路由...

2023-01-05 20:41:08

55浏览

0评论

React中react-redux和路由详解

目录观察者模式解决组件间通信问题react-reduxconnect方法Provider组件路由使用路由默认路由路由重定向获取路由参数路由导航观察者模式解决组件间通信问题使用观察者解决组...

2023-01-05 20:41:07

55浏览

0评论

教你快速搭建 React Native 开发环境

React Native 官网地址：https://www.reactnative.cn/docs/environment-setup开发平台 Windows目标平台 Android1、安装依赖必须安装的依赖有 Node、JDK 和 Android Studio，Nod...

2023-01-05 20:41:05

43浏览

0评论

React的createElement和render手写实现示例

目录TL;DR科普概念准备工作实现 createElement实现 render测试TL;DR本文的目标是，手写实现createElement和renderReact.createElement实现的本质就是整合参数变成对象，这个对...

2023-01-05 20:41:02

41浏览

0评论

react编写可编辑标题示例详解

目录需求初始需求方案设计方案一 span + contentEditable思路代码如下在这个方案中遇到的问题存在的问题方案二直接用input处理展示和编辑踩到的坑需求因为自己换工作到了...

2023-01-05 20:41:00

39浏览

0评论

React配置多个代理实现数据请求返回问题

目录使用axios以及express框架进行数据传输App.js:index.js:server1.js:server2.jssetupProxy.js:运行使用axios以及express框架进行数据传输react脚手架中src文件配置如下：A...

2023-01-05 20:40:57

36浏览

0评论

React实现pc端的弹出框效果

本文实例为大家分享了React实现pc端弹出框效果的具体代码，供大家参考，具体内容如下最近学习react碰见了一个小坑不知道为什么我在做一个弹出框的小demo很简单的一个小demo...

2023-01-05 20:40:53

62浏览

0评论

React拖拽调整大小的组件

本文实例为大家分享了React拖拽调整大小的组件，供大家参考，具体内容如下一、实现流程1.使用React.cloneElement加强包裹组件，在包裹的组件设置绝对定位，并在组件内加上四个可调...

2023-01-05 20:40:51

55浏览

0评论

react优雅处理多条件鼠标拖拽位移

本文实例为大家分享了react优雅处理多条件鼠标拖拽位移的具体代码，供大家参考，具体内容如下场景三种拖拽条件可纵轴横轴和全部方向如果加3个监听重复代码太多
因为状态更...

2023-01-05 20:40:49

46浏览

0评论

React中父子组件通信详解

目录父组件向子组件通信存在期父组件向子组件通信在父组件中，为子组件添加属性数据，即可实现父组件向子组件通信。传递的数据可以分成两类子组件是作为属性来接收这些数据的第...

2023-01-05 20:40:47

54浏览

0评论

React报错之Parameter event implicitly has an any type解决

目录引言总览设置类型逃生舱any确定类型引言原文链接：bobbyhadz.com/blog/react-…作者：Borislav Hadzhiev正文从这开始~总览当我们不在事件处理函数中为事件声明类型时...

2023-01-05 20:40:45

48浏览

0评论

React组件学习之Hooks使用

目录一、前言二、React Hooks2.1 useState2.2 useEffect2.3 useMemo2.4 useCallback2.5 useContext2.6 useRef三、总结一、前言react组件分为类（class）组件和函数（function）组件...

2023-01-05 20:40:43

52浏览

0评论

React实现表格选取

本文实例为大家分享了React实现表格选取的具体代码，供大家参考，具体内容如下在工作中，遇到一个需求，在表格中实现类似于Excel选中一片区域的，然后拿到选中区域的所有数据。1.实现...

2023-01-05 20:40:39

36浏览

0评论

react实现动态表单

本文实例为大家分享了react实现动态表单的具体代码，供大家参考，具体内容如下1.小要求在工作中，我们也会碰到这样子的需求：在填写信息的时候，可以填写多个人名、多个需求、以及动...

2023-01-05 20:40:36

48浏览

0评论

React实现动态调用的弹框组件

最近在用react开发项目，遇到一个需求——开发一个弹框组件。在react中创建一个组件是很简单的，只需要使用class创建并引入就可以了，但是要做到可以用js调用这个组件...

2023-01-05 20:40:35

30浏览

0评论

React事件处理和表单的绑定详解

目录一、事件处理1.1 React事件1.2 事件对象1.3 事件传参1.4 函数组件事件处理二、表单一、事件处理1.1 React事件React 元素的事件处理和 DOM 元素类似。但是有一点语法上...

2023-01-05 20:40:30

74浏览

0评论

React Hooks--useEffect代替常用生命周期函数方式

目录useEffect代替常用生命周期函数原始生命周期函数对React Hooks（useState和useEffect) 的总结思考一、为什么用React Hooks(面向生命周期编程变成了面向业务逻辑编程)二、...

2023-01-05 20:40:28

44浏览

0评论

React中useEffect与生命周期钩子函数的对应关系说明

目录React useEffect与生命周期钩子函数的对应关系使用格式一：不带参数的情况使用格式二：带第二个参数，参数为空数组使用格式三：带第二个参数，并且指定了依赖项使用格式四：依赖项...

2023-01-05 20:40:24

38浏览

0评论

React.js Gird 布局编写键盘组件

前言;Grid 布局则是将容器划分成"行"和"列"，产生单元格，然后指定"项目所在"的单元格，可以看作是二维布局。display: grid指定一个容器采用网格布局。接着划分行和列。grid-temp...

2023-01-05 20:40:23

43浏览

0评论

React 保留和重置State

目录前言一、state保留二、state重置总结前言在开发时，我们复用一个组件，比如说切换不同的聊天窗口，这个窗口是公用的组件<Chat/>聊天窗口、<ContactList/>组件，控制不同人的id...

2023-01-05 20:40:20

43浏览

0评论

ahooks useVirtualList 封装虚拟滚动列表

目录简介实现原理具体实现思考总结简介提供虚拟化列表能力的 Hook，用于解决展示海量数据渲染时首屏渲染缓慢和滚动卡顿问题。详情可见官网，文章源代码可以点击这里。实现原理...

2023-01-05 20:40:13

37浏览

0评论

React组件实例三大属性state props refs使用详解

目录一、 State1.概念2.State的简单用法3. JS绑定事件4.react 绑定事件5.react this指向问题6.修改state值7.代码简写二、props1.概念2.传参的基础方法、运算符传参三、refs...

2023-01-05 20:40:10

50浏览

0评论

React循环遍历渲染数组和对象元素方式

目录循环遍历渲染数组和对象元素遍历渲染数组遍历渲染对象元素遍历对象生成dom项目场景问题描述补充循环遍历渲染数组和对象元素遍历渲染数组1.单纯数组const pureArr = ['a...

2023-01-05 20:40:08

64浏览

0评论

React组件化学习入门教程讲解

目录模块化模块模块化组件化组件组件化函数式组件创建函数组件Props参数传递（重点）复合函数组件类式组件创建实例用户自定义组件模块化模块理解：向外提供特定功能的js程序,一般...

2023-01-05 20:40:05

67浏览

0评论

react-router-dom v6 使用详细示例

目录一、基本使用二、路由跳转2.1 Link 组件2.2 NavLink 组件2.3 编程式跳转三、动态路由参数3.1 路径参数路径匹配规则兼容类组件3.2 search 参数四、嵌套路由5.1 路由定义...

2023-01-05 20:40:03

35浏览

0评论

React+CSS 实现绘制横向柱状图

前言：页面一共分为两个结构文字 + 渐变柱形图为一个部分，下面的标注为一个结构。我们先看文字 + 渐变柱形图部分。总体使用 flex 布局，左边文字部分占总体的 50%，右边的占剩余的...

2023-01-05 20:40:02

40浏览

0评论

React hook实现简单的websocket封装方式

目录React hook实现websocket封装react自定义hook解决websocket连接,useWebSocket1、描述2、代码React hook实现websocket封装新建websocket.ts文件import {useState, useRe...

2023-01-05 20:40:00

46浏览

0评论

使用useEffect模拟组件生命周期

目录useEffect模拟组件生命周期让函数组件模拟生命周期初始化更新阶段卸载阶段useEffect实现componentWillUnmount生命周期函数阐述useEffect 解绑副作用useEffect的第二个...

2023-01-05 20:39:58

43浏览

0评论

ReactDOM 隐藏特性详解

目录前言React DevTools 的原理渲染阶段FiberRoot/FiberNodememoizedState 与 React Hooks实践：突破 useDebugValue 的限制useDebugValueAnywhere 的实现特定的 devtools总结...

2023-01-05 20:39:55

46浏览

0评论

React中使用react-file-viewer问题

目录使用react-file-viewerreact-file-viewer预览本地文件解决思路使用react-file-viewer1.npm install react-file-viewer2.在组建中引入import FileViewer from 'reac...

2023-01-05 20:39:51

30浏览

0评论

React中使用antd组件的方法

目录antd使用antdantdantd 是基于 Ant Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。国内镜像为：https://ant-design.gitee.io/docs/react/introduce-cn...

2023-01-05 20:39:48

46浏览

0评论

使用react在修改state中的数组和对象数据的时候(setState)

目录react修改state的数组和对象数据的时候(setState)需要注意react修改数组对象的注意事项删除数组中的指定元素合并两个对象修改多层级对象的值react修改state的数组和对...

2023-01-05 20:39:45

57浏览

0评论

react中使用forEach或map两种方式遍历数组

目录使用forEach或map两种方式遍历数组forEachmap循环遍历数组时map和forEach的区别forEach情况map 情况使用forEach或map两种方式遍历数组之前写代码，从后台提取数据并渲染...

2023-01-05 20:39:43

47浏览

0评论

React中编写CSS实例详解

目录正文内联样式普通的CSScss modulescss in js样式组件引入外部变量默认值引入全局样式provider样式继承动态添加class正文目前，前端最流行的开发方式是组件化，而CSS的设计...

2023-01-05 20:39:41

52浏览

0评论

React状态管理器Rematch的使用详解

目录Rematch使用1. Rematch介绍2. Rematch特性3. 基本使用Rematch使用1. Rematch介绍Rematch是没有样板文件的Redux的最佳实践，没有action types、 action creators, 状态转...

2023-01-05 20:39:39

43浏览

0评论

一文搞懂 React 18 中的 useTransition() 与 useDeferredValue()

目录前言什么是Concurrent React？设置项目实现 useTransition()isPending 是做什么的？前言React 18 引入了一个关键的新概念，称为“Concurrent”。并发涉及同时执行...

2023-01-05 20:39:37

46浏览

0评论

一文理解Redux及其工作原理

目录一、是什么二、工作原理三、如何使用小结一、是什么React是用于构建用户界面的，帮助我们解决渲染DOM的过程而在整个应用中会存在很多个组件，每个组件的state是由自身进行...

2023-01-05 20:39:32

51浏览

0评论

React 组件性能最佳优化实践分享

目录React 组件性能优化最佳实践组件卸载前进行清理操作类组件使用纯组件PureComponent什么是纯组件什么是浅层比较shouldComponentUpdate纯函数组件使用React.memo优化性能...

2023-01-05 20:39:30

56浏览

0评论

React Native 的动态列表方案探索详解

目录背景技术方案介绍内存异常处理未来规划背景时至2022，精细化运营已经成为了各大App厂商的强需求，阿里的 DinamicX、Tangram 大家应该都很熟悉了，很多App厂商也自研了一些类...

2023-01-05 20:39:28

166浏览

0评论

react中的watch监视属性-useEffect介绍

目录react的watch监视属性-useEffectuseEffect使用指南最基本的使用响应更新如何处理Loading和Error处理表单自定义hooks使用useReducer整合逻辑取消数据请求react的watch监...

2023-01-05 20:39:25

首页 «164 165166167 168 »尾页

热门文章