![](https://img-blog.csdnimg.cn/20190918140213434.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
React
文章平均质量分 57
React相关
iChangebaobao
菜鸟的前端进击之路
展开
-
[React] React 如何自定义Hook
https://blog.csdn.net/fengqiuzhihua/article/details/103511209转载 2022-06-24 11:07:14 · 748 阅读 · 0 评论 -
[React] Antd Form getFieldValue 的使用、DatePicker 禁用日期 disabledDate
在表单中,有时需要根据表单项的不同选择,对下面的表单项进行不同的显示,也就是说,后面的表单项依赖于前面的表单项,这时是可以使用getFieldValue 获取依赖项的值进行判断,从而显示不同的内容比如上面代码,当审核不通过原因选择其他时,显示一个 让用户填写Antd 日期组件的选择比如某个表单项,只能选择某个日期之后的日期.........原创 2022-06-06 15:25:20 · 2760 阅读 · 2 评论 -
[React] Antd Form.List 的基本使用
[React] Antd Form.List 的基本使用Form.List 为字段提供数组化管理。官网:https://ant.design/components/form-cn/#Form.List<Form.List name='infoList'> {(fields, {add, remove}) => ( <> <FormItem> {gettext('用户填写信息')} <Button原创 2022-05-07 15:06:55 · 3732 阅读 · 2 评论 -
[React] 如何在React 项目中添加 favicon.ico
如何在React 项目中添加 favicon.ico一、使用 create-react-app 搭建的项目二、未使用脚手架搭建的项目一、使用 create-react-app 搭建的项目如果将文件放入 public 文件夹,Webpack 将不会处理它。相反,它将被复制到构建文件夹中。要引用 public 文件夹中的资源,需要使用名为 PUBLIC_URL 的特殊变量。<link rel="icon" href="%PUBLIC_URL%/favicon.ico" type="image/x-i原创 2022-04-14 15:59:55 · 3002 阅读 · 0 评论 -
[React] 使用Hooks时使用setFieldsValue设置初始值无效的问题
原文链接: https://juejin.cn/post/6844904129253359623 useEffect(() => { if (formConfigListValues.length === 0) { form.resetFields(); } }, [formConfigListValues]); useEffect(() => { if (statusId) { form.setFieldsValue(转载 2021-11-22 16:54:57 · 1969 阅读 · 1 评论 -
[React]Day08—使用create-react-app 创建 react应用
[React]Day08—使用create-react-app创建react应用一、创建项目并启动一、创建项目并启动第一步,全局安装:npm i -g create-react-app第二步,切换到想创项目的目录,使用命令:create-react-app hello-react第三步,进入项目文件夹:cd hello-react第四步,启动项目:npm startMac 第一步需要加上 sudo,不然会报错 [permission denied]sudo npm i -g create-re原创 2021-08-27 16:06:20 · 316 阅读 · 0 评论 -
[React] antd DatePicker 时间日期控件,禁用今日之前/之后的日期
官方文档:https://ant.design/components/date-picker-cn/#APIyarn add momentimport moment from 'moment'// 限制当天之前的日期不可选const disabledDate = (current) => { return current && current <moment().subtract(1, "days"); //当天之前的不可选,不包括当天//return curr原创 2021-08-06 11:26:32 · 2462 阅读 · 1 评论 -
[React]Day07—React的 Diffing 算法
[React]Day07—React的 Diffing 算法经典面试题一、 react/vue的key有什么作用?(Key的内部原理是什么?)二、 为什么遍历列表时,key最好不要用index?<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <m原创 2021-07-28 18:10:52 · 117 阅读 · 0 评论 -
[React]React 生命周期之 getSnapshotBeforeUpdate
[React] React 生命周期之 getSnapshotBeforeUpdate getSnapshotBeforeUpdate() 的使用getSnapshotBeforeUpdate() 的使用getSnapshotBeforeUpdate(prevProps, prevState){ console.log('更新之前获取快照,getSnapshotBeforeUpdate~') return 'Snapshot: abc'}更新之前获取快照,在最后一次渲染输出(提交到DO原创 2021-07-28 16:08:19 · 855 阅读 · 0 评论 -
[React]Day06—React的生命周期
Day05—React 生命周期一、初始化二、挂载时三、更新时四、卸载组件五、详细介绍1、constructor()2、componentDidMount()3、componentDidUpdate()4、componentWillUnmount5、shouldComponentUpdate()React生命周期图谱一、初始化constructor()二、挂载时当组件实例被创建并插入 DOM 中时,其生命周期调用顺序如下:constructor()static getDerivedS原创 2021-05-28 09:57:03 · 206 阅读 · 0 评论 -
[React] React 实现的小功能:今天几点下班呢?
今天用 React 实现一个小功能,计算当天下班时间(例如我每天要上够 8 Hours,中午休息时间1.5 Hours)弹性上下班打卡必备<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" conten原创 2021-05-26 14:58:37 · 122 阅读 · 0 评论 -
[React]Day05—React 表单中受控组件与非受控组件
Day05—React 表单中受控组件与非受控组件一、受控组件二、非受控组件一、受控组件作者:LinDaiDai_霖呆呆链接:https://juejin.cn/post/6858276396968951822在HTML的表单元素中,它们通常自己维护一套state,并随着用户的输入自己进行UI上的更新,这种行为是不被我们程序所管控的。而如果将React里的state属性和表单元素的值建立依赖关系,再通过onChange事件与setState()结合更新state属性,就能达到控制用户输入过程转载 2021-05-25 18:29:18 · 115 阅读 · 0 评论 -
[React]Day04—React中类式组件的三大属性之refs & 事件处理
React中类式组件的三大属性之refs & 事件处理一、什么是refs?二、refs 的使用1、string ref 的使用 (React out API)2、回调 ref 的使用 (Before React V16)3、createRef 的使用 (After React V16)三、refs 的总结四、事件处理一、什么是refs?React提供的这个ref属性,表示为对组件真正实例的引用,其实就是ReactDOM.render() 返回的组件实例,ref 可以挂到任何组件上,可以原创 2021-05-25 16:29:57 · 186 阅读 · 2 评论 -
[React]Day03—React中类式组件的三大属性之props
React中类式组件的三大属性之一props的使用一、什么是props?二、props 的使用三、props 的总结一、什么是props?当 React 元素为用户自定义组件时,它会将 JSX 所接收的属性(attributes)以及子组件(children)转换为单个对象传递给组件,这个对象被称之为 “props”二、props 的使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF原创 2021-05-18 18:23:50 · 361 阅读 · 0 评论 -
[React]Day02—React中类式组件的三大属性之State
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>React 类式组件原创 2021-05-18 18:09:54 · 294 阅读 · 0 评论 -
[React]Day01—初识React、React中JSX语法规则、React 创建组件
Day01—React中JSX语法规则1. JSX在React中的使用2. JSX语法规则1. JSX在React中的使用在React中使用JSX语法来创建虚拟DOM2. JSX语法规则原创 2021-04-20 23:38:14 · 149 阅读 · 0 评论 -
[Vue]如何优雅简洁地实现时钟翻牌器(支持JS/Vue/React)
如何优雅简洁地实现时钟翻牌器(支持JS/Vue/React)原创 2019-11-28 12:05:30 · 2256 阅读 · 0 评论