![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
React
React
即将拥有人鱼线的Iverson
Stay Hungry. Stay Foolish
展开
-
如何在 React 页面中引入本地图片
方法1:<img src={require('../img/iconxx.png')} alt="" />方法2:import x1 from '../img/x1.png'import x2 from '../img/x2.png'<img src={x1} alt="" /><img src={x2} alt="" />方法3:...原创 2018-05-02 20:07:55 · 8054 阅读 · 3 评论 -
React 表格组件导出 Excel
以前我们导出表格都是走的后台接口调用,后台处理数据给我们返回Excel文件,这样就会增加后台的工作量,自从知道ReactTable表格组件可以导出excel后,就去研究了一下:GitHub地址:https://github.com/zsusac/ReactHTMLTableToExcel安装插件react-html-table-to-excel:npm install --save......原创 2018-11-30 12:22:52 · 5189 阅读 · 7 评论 -
`require(“history“).createHashHistory` instead of `require(“history/createHashHistory“)`.
React在版本升级后也出现如下报错:解决办法:1、找到 node-modules\dva\lib\index.js 文件:2、修改:var _createHashHistory = _interopRequireDefault(require("history/createHashHistory"));为:var _createHashHistory = _int......原创 2019-10-17 10:13:42 · 1268 阅读 · 4 评论 -
`require(“history“).createBrowserHistory` instead of `require(“history/createBrowserHistory“)`.
React在版本升级后也出现如下报错:解决办法:1、先全局搜索下'createBrowserHistory'<Ctrl+Shift+F>:2、可能会有以下两种中的其一:2.1、若搜索出的代码是:import createBrowserHistory from "history/createBrowserHistory";const customHistory......原创 2019-10-17 10:30:30 · 3240 阅读 · 1 评论 -
React 实现键盘监听事件
1、在需要进行监听的Dom上添加 onKeyDown 方法: <Button className='btn-add' type="primary" icon="search" onKeyDown={(e)=>this.handleKeyDown(e)} onClick={()=>this.handleSearch()}>...原创 2019-11-25 16:49:43 · 6724 阅读 · 1 评论 -
React 中 Table 数据源已经改变,但是 Table 却没有显示新的数据
前言:在前段时间有一个 React 中的 Bug 真是困扰了我好长时间~~~场景还原:点击 Table 的某一行,下方显示另一个 Table ,其数据是上方 Table 数据源中的子数据实现思路:给 Table 数据重新给一个新的唯一的ID 并赋值给 Table 的 rowKey1、在点击 Table 的行的方法中:onRow={(record, index) => {......原创 2019-11-25 19:23:39 · 4014 阅读 · 1 评论 -
基于React封装的可拖拽排序的表格组件
废话不多说,直接开干~~~~1、安装必须的依赖: "react-dnd": "^10.0.2", "react-dnd-html5-backend": "^10.0.2", "immutability-helper": "^3.0.1",2、组件代码如下:import React from 'react';import {Table,} from 'antd';import {DndProvider,DragSource,DropTarget,} from 'r原创 2021-01-18 16:19:31 · 924 阅读 · 1 评论 -
Ant-Design-Pro中:EditableProTable在ProForm保存时一并验证EditableProTable中每条数据的规则是否满足
注:EditableProTable默认是在单行保存时调用表单验证,如下图:现在项目有个需求:是点击EditableProTable外部的保存按钮对整个表单进行验证,实现效果如下:思路如下:EditableProTable提供了editable属性,可以设置form属性:官网地址实现代码如下,复制可直接运行):import React, { useState, } from 'react';import { FooterToolbar, } from '@ant-desi原创 2021-04-28 16:53:06 · 6327 阅读 · 2 评论 -
Ant Design Pro如何全局更换页面的Loading样式?
前言:最新的项目用的是Ant Design Pro v5.0的框架,每个页面的Loading默认用的是Spin组件,以前的项目也是默认用的Spin项目,在这个项目中看到后就有点审美疲劳了~~~,所以就想替换掉默认的加载动画,在网上也找了好多方法,有的是语言不对应,有的是版本不对应,有的虽然可以实现,但是要在每个请求时去做处理,就会比较麻烦,经过认真查阅官网API,在Spin组件的最后一句话中发现了实现的最优方案 ):官网地址话不多数,直接上实现过程:1、在项目的src/components文原创 2021-04-30 11:30:08 · 5206 阅读 · 1 评论 -
React + Dva 开发中 BUG 记录和超好用的组件
开发环境搭建步骤:阿里项目实战:https://ant.design/docs/react/practical-projects-cn坑1:表格列数据值都需要添加唯一的 key按照 阵营的规范,所有的组件数组必须绑定键在表中,dataSource状语从句: columns里的数据值都需要指定 key。对于值 dataSource默认将每列数据的 key属性作为唯一的............原创 2018-04-26 09:51:26 · 492 阅读 · 1 评论