dk123sw的博客

原理： 只渲染可视节点以减少DOM开销，提升加载速度以下代码是伪代码，具体实现看这如果你想在项目中使用复杂的虚拟滚动，可以看下react-virtualized。本文只提供虚拟列表实现思路实现步骤创建容器<div className="container"> <div className="virtual-container" /></div> .container { height: 200px; widt.

针对项目内图片文件 <div style={{ backgroundImage: `url(${bgImg})`, ...extraStyle }} /> <div style={{ backgroundImage: `url(${require("./12.jpg")})`, ...extraStyle }} />针对Url <div

代码来源于https://github.com/ant-design/ant-design-pro/blob/all-blocks/src/pages/dashboard/monitor/index.tsx个人代码实现

为什么会出现hook难以复用类组件之间的逻辑 生命周期中经常包含一些莫名其妙的不相关逻辑 类组件难以被机器和人理解 核心算法的改变在V16版本之前 协调机制 是 Stack reconciler， V16版本发布Fiber 架构后是 Fiber reconciler。新的架构使原来同步渲染的组件现在可以异步化，可中途中断渲染，执行更高优先级的任务。在React 17中，在...

在使用async awit之前先确定项目支不支持（不支持报regeneratorRuntime is not defined）使用webpack搭建的项目可使用这里提供webpack配置支持使用babel-preset-stage-3、babel-polyfill 或babel-plugin-transform-runtime 注意babel v6、v7版本配置稍有不同继发...

react-redux比较简单的去理解react-redux https://www.jianshu.com/p/7a71181a7aa0redux原理分析 https://segmentfault.com/a/1190000012976767react + redux 完整的项目，同时写一下个人感悟(不是我的 233)https://segmentfault.com/a/1190...

写在前边本文主要介绍如何实现滑动切换及遇到的问题，具体组件在这如果你需要的是轮播图，这里有两个轮子react-slick、nuka-carousel原生DOM操作，非React框架下也能使用我们想实现触摸切换无非是做以下三件事监听触摸事件判断用户当前操作是否是切换进行页面切换获取触摸事件先了解触摸事件要想监听触摸事件整个流程需要监听以下三个事件let li...

（ 如果前面失效 链接: https://pan.baidu.com/s/1oqdihRVTknM_AdzX31oZzg 提取码: 54qx ）把上面下载的json文件放到下面同级文件夹下 参考这句引用let districtData = require('./location');老实说实现方法很简单，antd-mobile提供了组件，只是没提供国家行政区数据，我只是把数据‘交给’这个组件罢了。这里使用的是国家标准(GB/T2260)，也就是2016年的标准行政区。如果大佬有最新的数据，希望能分享一下。

原地址：https://segmentfault.com/a/1190000009149186#articleHeader8写出来完全是因为自己不长记性啊，三次了因为给数组设置key={index}导致数据出问题，每次都找半天找不到问题。一个例子有这样的一个场景如下图所示，有一组动态数量的input，可以增加和删除和重新排序，数组元素生成的组件用index作为key的值，例如下图生成的...

 react-component/formhttps://github.com/react-component/form#option-object yiminghe/async-validatorhttps://github.com/yiminghe/async-validator/import { createForm } from 'rc-form';clas...

项目需要一个添加多张图片再把图片url传给后台的组件（嘛，照片选取用ImagePicker就好啦）大体样子如下主要问题是在使用七牛取到url之后的存取问题下面主要讨论使用ImagePicker换行时browse_button对应id出现的问题。另外说一下移动端如何让id对应按钮直接调起相机以及图片压缩的方法。（使用七牛js版本为1.x,静态文件方式引入，antd-mobile使用...

路由创建        HashRouter和BrowserRouter的使用        (官网推荐的是BrowserRouter，但是此方式需要服务器配合,所以就使用HashRoute啦)    引用方式如下：    控件说明：       使用&lt;Switch&gt;组件来包裹一组&lt;Route&gt;。&lt;Switch&gt;会遍历自身的子元素（即路由）并对第一个匹配当前路径...

这里组件间参数传递只介绍利用回调传递（ref不介绍）即子组件向父组件传值。（父组件向子组件传值用props,层级较深或无关联组件间传参即需要全局数据管理参考react-redux、MobX等）组件内（无默认参值和需要默认参值情况）class Demo extends Component{ constructor(props){ su...

在使用react 中经常会遇到各种个样的问题，如果对react不熟悉则会对遇到的问题感到莫名其妙而束手无策，接下来分析一下react中容易遇到的问题和注意点。1、setState()是异步的this.setState()会调用render方法，但并不会立即改变state的值，state是在render方法中赋值的。所以执行this.setState()后立即获取state的值是不变的。同样的直接赋...