本文采用倒叙，希望能够看完后在进行redux的实现，有助于理解。这里先放置好展示组件和容器组件。因为归根结底我们还是要知道这个东西怎么用。我这里展示了class和hook中两种不同的使用方法，如果觉得有帮助可以点个赞或者收藏！如果你是从来没有接触过redux的开发者，希望您能够有耐心的看一看，我也是...
JavaScript 2021-06-10 323 0 0 阅读全文
1.利用html-webpack-externals-plugin分离基础库在做React开发时，经常需要引入react和react-dom基础库，这样在打包的时候速度就会比较慢，这种情况下我们可以将这些基础库忽略掉，将它们通过CDN的方式直接引入，而不打包到bundle文件里面去。1.安装插件np...
JavaScript 2023-01-26 41 0 0 阅读全文
安装npminstallvditor-s引用导入依赖包importVditorfrom"vditor";导入样式import"vditor/src/assets/scss/index.scss";使用示例exportdefaultclassVditorexte...
JavaScript 2021-04-06 238 0 0 阅读全文
说明：项目是create-react-app结合antd-mobile写的H5，在微信公众号里运行。1、使用a标签预览或下载PDF。写法如下，手机上点击无反应，电脑上点击网页崩溃。PDF或图片名称原因是浏览器监测到访问非安全访问，给拦截下来了。于是根据报错提示，新增target和rel两个属性，写法...
JavaScript 2021-04-16 168 0 0 阅读全文
1.内联样式优点：这种方式较为简单，一目了然，给标签添加style属性。缺点:这种方式可以造成项目结构较为臃肿，造成css命名冲突。importReact,{Component}from'react'importPropTypesfrom'prop-types'exportdefaultclassi...
JavaScript 2021-04-16 205 0 0 阅读全文
React中，会遍历EffectList来执行节点操作、生命周期方法、Effect方法，可以把EffectList比作圣诞树上挂的彩灯，而这颗圣诞树就是Fiber树。为什么会存在EffectList呢？打个比方来说，一颗Fiber树中有一些Fiber节点需要执行componentDidMount方法...
JavaScript 2021-04-07 269 0 0 阅读全文
问题这样的问题貌似原因还挺多的，我的问题是带参数的url不能刷新，router5.0版本，使用withRouter关联组件进行页面跳转如下所示路由代码解决方案在路由组件上最上层元素上加一个key增加路由的识别度，因为普通的跳转是根据path来识别的，但是path带上参数时，路由无法精确识别。不过，在...
JavaScript 2021-06-29 380 0 0 阅读全文
React组件有哪些生命周期函数？类组件才有的生命周期函数，包括ES6语法的class以及create-react-class模块：分为几个阶段：挂载，更新，卸载，错误处理；1，挂载：constructor(常用)、staticgetDerivedStateFromProps、render(常用)、...
JavaScript 2021-06-29 218 0 0 阅读全文
最近在准备面试。复习了一些react的知识点，特此总结。开始React生命周期react16以前的生命周期是这样的组件在首次渲染时会被实例化，然后调用实例上面的componentWillMount，render和componentDidMount函数。组件在更新渲染时可以调用componentWil...
JavaScript 2021-04-23 185 0 0 阅读全文
为什么使用setState在React的开发过程中，难免会与组件的state打交道。使用过React的都知道，想要修改state中的值，必须使用内部提供的setState方法。为什么不能直接使用赋值的方式修改state的值呢？我们就分析一下，先看一个demo。classIndexextendsRea...
JavaScript 2021-04-23 219 0 0 阅读全文
上一篇文章中有同学提到路由鉴权，由于时间关系没有写，本文将针对这一特性对vue和react做专门说明，希望同学看了以后能够受益匪浅，对你的项目能够有所帮助，本文借鉴了很多大佬的文章篇幅也是比较长的。背景单独项目中是希望根据登录人来看下这个人是不是有权限进入当前页面。虽然服务端做了进行接口的权限，但是...
JavaScript 2021-04-27 258 0 0 阅读全文
在单页应用如此流行的今天，曾经令人惊叹的前端路由已经成为各大框架的基础标配，每个框架都提供了强大的路由功能，导致路由实现变的复杂。想要搞懂路由内部实现还是有些困难的，但是如果只想了解路由实现基本原理还是比较简单的。本文针对前端路由主流的实现方式hash和history，提供了原生JS/React/V...
JavaScript 2021-04-23 237 0 0 阅读全文
近期在某平台开发迭代的过程中遇到了超长List嵌套在antdModal里加载慢，卡顿的情况。于是心血来潮决定从零自己实现一个虚拟滚动列表来优化一下整体的体验。改造前：我们可以看出来在改造之前，打开编辑窗口Modal的时候会出现短暂的卡顿，并且在点击Cancel关闭后也并不是立即响应而是稍作迟疑之后才...
JavaScript 2021-04-08 177 0 0 阅读全文
序在使用react-router-dom在编写项目的时候有种感觉就是,使用起来非常的方便,但是若是维护起来,那便是比较麻烦了,因为各大路由分散在各个组件中.所以我们就会想到,使用react-router-dom中提供的config模式来编写我们的路由,这样写的好处就是我们可以将逻辑集中在一处,配置路...
JavaScript 2021-04-23 215 0 0 阅读全文
Reacttsx生成随机验证码，供大家参考，具体内容如下最近开发React使用tsx编写，没有找到什么好的随机生成验证码的插件，自己就手撸了一个，废话不多话，直接上代码。tsx文件如下：React代码片.import*asReactfrom"react";constsize=4;...
JavaScript 2021-04-24 210 0 0 阅读全文
首先确保已经安装了antd,axiosjsx文件:importReact,{useState,useEffect}from'react'import{Pagination}from'antd';import'./loading.scss'importUnitfrom'../hml'constApp=...
JavaScript 2021-06-03 167 0 0 阅读全文
React是一个用于构建用户界面的JAVASCRIPT库。React主要用于构建UI，很多人认为React是MVC中的V（视图）。React起源于Facebook的内部项目，用来架设Instagram的网站，并于2013年5月开源。React拥有较高的性能，代码逻辑非常简单，越来越多的人已开始关注和...
JavaScript 2021-04-22 179 0 0 阅读全文
几种react中插入图片以及背景图片的方式img标签引入图片因为react其实是通过js的reader函数渲染的页面，所以直接写src=“路径”是无法引入图片需要用下面的方式引入背景图片引入1第一种就是常规的新建一个css文件，然后就可以直接写css语法了.img{background:url('....
JavaScript 2021-06-03 267 0 0 阅读全文
使用React-Beautiful-Dnd实现列表间拖拽踩坑
为什么选用react-beautiful-dnd相比于react-dnd，react-beautiful-dnd更适用于列表之间拖拽的场景，支持移动端，且较为容易上手。基本使用方法基本概念DragDropContext：构建一个可以拖拽的范围onDragStart：拖拽开始回调onDragUpdat...
JavaScript 2021-05-26 243 0 0 阅读全文
开展新项目本文主要记录最近工作一个新项目从0-1的过程，主要记录3个节点，选型、运行时、上线。项目选型react脚手架初始化，社区比较火的有cra（create-react-app）和umi，从以下几点进行对比最终选择了比较贴合项目的umi。易用性，开箱即用。umi内置了许多功能，可是也带来很多限制...
JavaScript 2021-03-27 296 0 0 阅读全文
- 上一页
- 下一页