当有测试小姐姐陆续跟我提xxx后缀的文件无法正常上传的时候，我们可能就陷入了，怎么可能********…。1.直面问题我们一开始固定的想法就是使用type来进行文件类型的判断，这是毫无疑问的，不判断类型判断个啥对吧！我后来发现这个type可能会受到多种因素的影响，导致type值在不同的地

<Rowgutter={12}><Colspan={12}><Form.Itemlabel="省/市/区"><CascaderfieldNames={fieldNames}options={options}

react创建项目报错errorF:\专班\react\beijing-normal-university\node_modules\core-js:Commandfailed.Exitcode:1Command:node-e"try{require('./postinstall')}catch(e){}"Arguments:Directory:F:\专班\react\beijing-normal-university\

做的小案例下方的加粗字是Conitem主键,leftform组件是加粗字上方主要实现在Conitem中点击+1,和显示leftform点击提交后的内容redux其实还是不去说太详细我的项目了,直接点就是说当action的type是相同的时候会报错

1.父传子//父组件向子组件传值，通过props，将父组件的state传递给了子组件。/**父组件*/exportdefaultclassParentextendsComponent{constructor(props){super(props)this.state={message:"中秋节快乐呀"}}render(){return(

虚拟DOM和真实DOM关于虚拟DOM1.本质是Object类型的对象（一般对象）2.虚拟DOM比较“轻”，真实DOM比较“重”，因为虚拟DOM是React内部再用，无需真实DOM上那么多的属性。3.虚拟DOM最终会被React转化为真实DOM，呈现在页面上

项目采用electron跟react项目开发目前最烦的事情就是，一个命令框需要启动react一个则需要启动electron。能不能将两个命令进行合并呢？答案是：能！！！怎么做呢？首先，我们需要新增一个插件concurrently使用命令 npminstallconcurrently--save-dev进行安装其次，我们需要修改pac

1.virtualDOM传统页面开发模式中，都是对真实的dom进行操作，耗费大量的性能。而react将真实dom树转换成虚拟dom,每一次更新都与原来的虚拟dom进行diff比对来进行更新，对于改变的部分来进行批量更新，节约了性能。通过虚拟dom转换成真实dom，方便和其他平台的集成，react组件可以映射为对

目录一、生命周期一、生命周期函数组件无生命周期，生命周期只有类组件才拥有 。生命周期函数指在某一时刻组件会自动调用并执行的函数。React每个类组件都包含生命周期方法，以便于在运行过程中特定的阶段执行这些方法。例如：我们希望在第一次将其呈现到DOM时设置一

//子组件letComponent=(props)=>{const{refInstance}=props;//只要是实例都行useForm和useRef创建的都可以const[form]=Form.useForm();useImperativeHandle(refInstance,()=>({submit:()=>{form.submit();}

关于react_antd_desgin的学习这两天也是获取到的知识零零散散，大多在网上也能获取的到，所以隔了很长的时间，没有编写关于react相关的文章。今天之所以写也是因为公司中秋节放假，在郑州，窗外的秋雨淅淅沥沥，再加上一点带有凉意的秋风，打消了外出的念头。在家也是无所事事,,,好了，言归正传

由于此时的history需要父组件提供，因此在调用子组件时，父组件需进行传参：<FlexBarnavs={navs}history={this.props.history}/>同时子组件通过props.history.push(path)即可实现跳转：<FlexclassName="nav">{props.navs.map(item=>(<Flex.Itemkey

react中异步action的使用      Count组件  效果图: 

Example4.jsximportReact,{useState,createContext,useContext}from'react'constCountContext=createContext();functionCounter(){letcount=useContext(CountContext)return(<h2>{count}</h2>)}fun

react中编程式路由 详情页    

在最新版的antd中，.ant-table-pagination**是flex，.ant-table-pagination-right**设置的justify-content:flex-end，所以分页默认在右边展示，如下：我们想要分页居中，首先要把flex给成display:block;然后在给.ant-table-pagination-right设置居中text-align:center;上代

一、引入antd产生的黄色报错Youareusingawholepackageofantd-mobile,pleaseusehttps://www.npmjs.com/package/babel-plugin-importtoreduceappbundlesize.原因是antd希望按需引入，但以import { TabBar } from "antd-mobile";形式引入时实际上会在底层将所

React中路由基本&高级使用 一、基本使用下载路由插件react-router-domnpminstallreact-router-dom 路由前言：在原生的html中，靠<a/>跳转不同的页面在React中靠路由链接实现切换组件 react-router-dom的理解react-router给web开发人员、native原生开发人员

1.创建storeimport { createStore } from 'redux';import reducers from '..educers/index';export default createStore(reducers);2.reducer（接受state和action并返回新的state） import { combineReducers } from "redux";import { tod

1，store保存数据的地方，管理全局的状态import{createStore}from'redux';conststore=createStore(reducter);store.getState();store.dispatch(action);store.subscribe(liatener);2，stateconststate=store.getState();一个state对应一个view所有的state都以一个对

React数据共享插件-PubSub 下载pubsub-js插件npminstallpubsub-js  如果要修改一个变量值的话PubSub.publish('state',{isLoading:true})  如果有人修改了这个变量，就触发下面的回调函数PubSub.subscribe('state',(msg,stateObj)=>{this.setState

引言基于该文仿写：web完整轮播图——带只拖鞋去流浪https://zhuanlan.zhihu.com/p/138232728组件源码：https://gitee.com/leftstanotation.git组件效果：https://www.jianguoyun.com/p/Dd81zscQzLDdCRiKuo4E   创建项目创建一个umi2.x的项目选择项目类型为app，不使用t

React简介一、react是什么是用于构建用户界面的JavaScript库是一个将数据渲染为HTml视图的开源JavaScript库二、react开发者国外FaceBook开发，并且开源近十年正在被腾讯阿里等一线大厂广泛使用三、学React原因原生JS命令式编码操作DOM繁琐、效率低，比如说：js的docu

整理了一些待学习的前端技术1、大屏技术，没有实际经历2、flutter，想学习，但没有机会3、node.js后台开发，没有实际机会4、chrome浏览器插件，没有实际开发5、vscode插件开发，没有实际机会6、npm包开发，没有实际的包7、vue3没有实际开发，8、reacthook，在知否项目里用了，但不多，说不出个

importReactfrom'react'importaxiosfrom'axios'import*asechartsfrom'echarts';import'../css/EchartsTest.css'exportdefaultclassEchartsTestextendsReact.Component{ constructor(){ super()

基本操作#★★★前提条件(可以运行create-react-app和yarn)★★★#创建项目(后面的操作记住进入项目根目录)create-react-app项目名--templatetypescript#添加antd和[email protected]@0.21.1#配置mobx(在TS中使用注解需要根据提示配置)#安

一、如何批量更新在【Hooks】中如果单独的进行状态的更新可能会导致页面的多次渲染：import{useState}from'react';import{unstable_batchedUpdates}from'react-dom';//批量更新状态时使用importReactfrom'react';constExample=()=>{const[count,s

记录一下react-router的学习1：安装react-routercnpminstallreact-router-dom--save2：定义一个AppRouter.js,导入需要的包importReactfrom'react';import{BrowserRouterasRouter,Route,Link}from'react-router-dom';3：定义组件//首页functionIndex(){r

React组件通信1.父子组件通信1.1父传子采用props的格式1.2子传父2.兄弟组件通信3.祖孙组件传值总结搭配方式1.父子组件通信1.1父传子采用props的格式父组件中exportdefaultclassFatherextendsComponent{ //数据状态 state={todos:[ {id:'001'