React
文章平均质量分 77
赵小左
前端菜鸟,喜欢打滚摸爬。
展开
-
React、Vue项目中如何调用多个不同的后台请求地址
在项目每次发起请求的时候,根据当前业务传入不同的参数,分别获取不同的请求接口即可。线上一个服务器,那如果说这是在内网环境下部署呢,就比如医院项目中,有三个服务器,一个资源上传,一个普通接口(包含认证),一个表单数据记录。上述代码中axios,是我二次封装的axios,axios的部分代码如下,它接收传递进来的url 做为项目的请求地址。首先,我们先来拆解它的需求,也就是说我们一个网页项目需要同时使用三个不同地址的需求。原创 2022-10-19 15:49:50 · 4179 阅读 · 2 评论 -
React、Vue项目build打包编译后如何再修改后台请求地址
目打包编译 npm run build 之后成为了普通的静态网页才可上线进行部署及发布。同样这时候我们也已经将代码全部写好了。如果说要改里面的某个值或者修改请求地址我们应该怎么办呢?原创 2022-10-19 15:13:30 · 3244 阅读 · 2 评论 -
React之Context 上下文模式
React组件树A节点,用Provider提供者注入了theme,然后在需要theme的地方,用Consumer消费者形式取出theme,提供给组件渲染使用。老版本的Context老版本中,React用PropTypes来声明context类型,提供者需要getChildContext来返回需要提供的context,并且用静态属性childContextTypes声明所需要提供的context数据类型。原创 2022-10-12 19:35:43 · 679 阅读 · 0 评论 -
React之ref的高阶用法
如果通过高阶组件包裹一个原始类组件,就会产生一个问题,如果高阶组件HOC没有处理ref,那么由于高阶组件本身会返回一个新的组件,所以当使用HOC包装后组件的时候,标记的ref会指向HOC返回的组件,而并不是HOC包裹的原始类组件,为了解决这个问题,forwardRef可以对HOC做一层处理。在爷爷组件中可以进行使用。比如想要通过标记子组件ref,来获取子组件下的孙组件的某一DOM元素,或者是组件实例。父组件使用 props传递值,将子组件给父组件要说的话的方法传递给子组件,供子组件给父组件进行传递。原创 2022-10-12 19:32:00 · 1647 阅读 · 0 评论 -
React之Ref如何去使用?
ref对象的创建,所谓创建,就是通过React.createRef或者React.useRef来创建一个Ref原始对象。而react对ref的处理则是,主要指的是对于标签中的ref属性,react是如何处理以及react转发ref。什么是ref对象,ref对象就是用createRef或者useRef创建出来的对象。第二种是通过函数组件创建Ref,可以用hooks中的useRef来达到同样的效果。第一种是通过React.createRef 创建一个ref对象。react提供两种方法创建ref对象。原创 2022-10-12 19:28:50 · 459 阅读 · 0 评论 -
React之ReactHook与生命周期
useEffect 和 useLayoutEffect的区别: 修改DOM,改变布局就用useLayoutEffect,其它全用useEffect。问: useEffect 与 componentDIdMout 以及 componentDidUpdate执行时机有什么样的区别?答:useEffect对react是异步执行,而componentDIdMount 以及 componentDidUpdate是同步执行。useEffect不会阻塞游览器绘制。原创 2022-10-12 19:25:26 · 1447 阅读 · 0 评论 -
React之Class类组件的生命周期
react在render阶段会深度遍历react fiber 树,目的就是发现不同(diff),不同的地方就是接下来需要更新的地方,对于变化的组件,就会执行render函数,在一次render过程中结束后,就回到commit阶段,commit阶段会创建修改真实的DOM节点。在mount阶段,首先执行的是constructClassInstance函数,用来实例化React组件,在组件章节已经介绍了这个函数,组件中constructor就是在这里执行的。原创 2022-10-12 19:23:19 · 1555 阅读 · 0 评论 -
React之使用Props的小技巧
上述代码中,Container 为父级组件,Children为子级组件,父级组件嵌套子级组件的时候,在父级组件中可以通过props.children获取到父组件下的子级组件的元素。1, 抽象 props 抽象 props 一般用于跨层级传递 props,一般不需要具体指出 props 中某个属性,而是将 props 直接传入或者抽离道子组件中。Father组件一方面直接将Index组件的IndexProps抽象传递给了Son组件,一方面也混入了自己的fatherProps。2,混入 props。原创 2022-10-12 19:21:39 · 571 阅读 · 0 评论 -
React之setState详解
a. 在不是 pureComponent 组件模式下,setState 不会浅比两次 state 的值,只要调用 setState,在没有其它优化手段的前提下, 就会执行更新,但是 useState 中的 dispatchAction 会默认比较两次 state 是否相同,然后决定是否更新组件。setState 的第一个参数: 当 obj 为一个对象的时候,则为即将合并的 state,如何 obj 是一个函数,那么当前组件的 state 和 props 将作为参数,返回值用于 合并新的 state。原创 2022-10-12 19:18:06 · 2763 阅读 · 0 评论 -
React基础知识
(3)在主store下的reducer中引入各个组件的reducer 以及统一的reducer管理工具 combineReducers 用来统一合并reducer。(4)在对应使用的页面则需要在 store.state.header.focused 中间添加header 组件来获取使用。c. 在对应组件的store的index.js中引入constants 跟actionCreators 两个文件。(2)在对应组件的文件夹store下新建文件actionCreators来表示对应的dispatch方法。原创 2022-10-10 14:29:30 · 550 阅读 · 0 评论 -
[React]关于React的组件
在react中,我们可以这样认为一切皆组件。我们的项目就是基于组件。class 是类组件,function 则为函数式组件。本章我们就一起来仔仔细细的玩懂React的组件。原创 2022-09-16 16:29:10 · 1573 阅读 · 0 评论 -
[React]为什么写React组件的时候,需要先引入React?
React相信各位伙伴都不陌生,那么你的React技术还好吗?来跟我一起重学一遍React,看看有什么知识是你没有记住的呢?一起来查漏补缺原创 2022-09-16 15:32:48 · 1372 阅读 · 0 评论