春节临近，办公室里半片空位，半片浮嚣。想到将放假，屏幕上的代码也都变成了雀跃的小虫。无法专心了。终于还是强迫自己读了半篇文档，写了几坨程序。这次记录的是关于React，最浅显的内容。 ———— 我是望眼欲穿的分割线 ———— Step 1：npm init按照向导填写各个字段，最后生成package.json文件。容易出错的是：name的值不要和包包同名。比如我们后续需要使用n
转载
2024-08-20 10:27:28
21阅读
前言正如我上一篇博客当中提到的，现在绝大部分的ReactNative应用均是采用融合到已有项目中的方式，把项目中的某一个模块使用ReactNative来开发，所以有必要弄清楚ReactNative是如何融合到已有项目的。一、新建一个Android项目 注意Minimum SDk选择API16以上 二、添加JS打开studio的Terminal窗口，输入如下命令：npm init会让你输入一些初始化
转载
2023-12-17 08:28:21
109阅读
在现代Web开发中，React与Axios的结合是数据交互的绝佳选择。本文将详细介绍如何封装Axios以便在React项目中更加高效地处理HTTP请求。在这篇文章中，我会从环境准备开始，逐步引导你了解集成步骤、配置详解、实战应用、排错指南以及性能优化。该过程将涉及多个技术要点，以及有用的可视化工具，确保你能够完全掌握react axios封装axios的技能。
## 环境准备
我们需要设置Re
在开发现代 React 应用时，处理 HTTP 请求是最基础也是最重要的任务之一。Axios 是一个基于 Promise 的 HTTP 客户端，可以在浏览器和 Node.js 中使用。今天，我将详细记录如何在 React 项目中封装 Axios 的过程，包括环境准备、集成步骤、配置详解、实战应用、排错指南及生态扩展。
## 环境准备
在开始之前，我们需要确保我们的开发环境已经准备妥当。我们将安
React笔记2——ReactAjax和React路由三、ReactAjax1、脚手架配置首先，安装一个轻量级框架axiosyarn add axios在App组件中定义两个简单的按钮分别用来获取学生数据和汽车数据。在测试时，需要打开测试服务器进行监听。import React, { Component } from 'react'
import axios from 'axios'
expor
转载
2024-06-17 06:35:22
5阅读
十日谈 :React API欢迎阅读我的React源码学习笔记JSX到JS的转换reactElementcreatElement方法ReactElement方法Component & pureComponentComponentpureComponentcreateRef & refcreateRefforword-refcontextConcurrentModeSuspense
转载
2023-12-01 11:41:17
43阅读
...
转载
2021-09-10 14:07:00
184阅读
2评论
react--axios
原创
2021-07-15 10:19:58
132阅读
1.配置axios代理 使得axios 可以不写根路径 package.json 2.使用
转载
2019-01-27 11:12:00
170阅读
2评论
react--axios
原创
2022-01-18 17:27:13
143阅读
# React Native Axios实现步骤
## 概述
本文将以一名经验丰富的开发者的身份来教会一位刚入行的小白如何实现"React Native Axios"。Axios是一个基于Promise的HTTP客户端，用于浏览器和Node.js中的数据请求。在React Native中，我们可以使用Axios来发送HTTP请求，获取和处理服务器返回的数据。
## 整体流程
下面是实现"Rea
原创
2023-08-18 15:38:11
329阅读
# 如何实现“react debounce axios”
## 概述
在React开发中，我们经常会遇到需要在输入框中输入内容后发送请求的场景。但是如果用户输入速度太快，可能会导致频繁的请求，这时就需要使用debounce来控制请求的频率。同时，可以使用axios来发送请求。
## 流程
下面是实现“react debounce axios”的流程：
| 步骤 | 操作 |
| ------
原创
2024-03-04 07:05:43
44阅读
前言随着vue/react这类以数据驱动为主的web框架的不断完善和壮大，越来越多的前端团队开始着手搭建内部的组件库。虽然目前市面上已经有很多功能强大且完善的组件库供我们使用，比如基于react的开源组件库ant-design，material，又比如基于vue的开源组件库elementUI，iView等。 我们在开发管理系统或者中台产品时，完全可以使用这种第三方库来开发，因为首先其服务的用户
一、初始环境搭建1.环境组件由于从网上查找React-native的搭建版本是0.48，我就还通过win10的powerShell安装了 -ChocolateyChocolatey是一个 Windows 上的包管理器，类似于 linux 上的yum和 apt-get。 你可以在其官方网站上查看具体的使用说明。一般的安装步骤应该是下面这样： @powe
1、react组件封装封装组件分三类：封装普通展示类组件 通过函数组件实现，不带生命周期，不带state封装纯逻辑类组件 通过组件的生命周期来做判断，给传入的组件加上一些附加属性或逻辑操作或props封装通用业务组件 上述两种组合，组件本身可完成独立的通用业务。可组合、可维护、可重用 一个设计良好的组件应该有什么特性？ 高内聚低耦合 在封装一组组件时候应该思考什么？ 组件应该是做什么的 组件至少应
转载
2023-11-07 06:40:30
119阅读
在React中，生命周期函数指的是组件在某一时刻会自动执行的函数。生命周期函数也叫钩子函数。constructor在组件创建的时候自动执行，也是一个生命周期函数（普通的类周期函数），但不是React独有的生命周期函数。render函数是React的一个生命周期函数，当数据发生变化时，render函数会自动执行。生命周期函数是针对组件的，每个组件都有生命周期函数。1 组件初始化阶段（Initiali
转载
2024-07-25 13:34:59
37阅读
背景：由于react官方并没有提供缓存组件相关的api（类似vue中的keepalive），在某些场景，会使得页面交互性变的很差，比如在有搜索条件的表格页面，点击某一条数据跳转到详情页面，再返回表格页面，会重新请求数据，搜索条件也将清空，用户得重新输入搜索条件，再次请求数据，大大降低办公效率，如图：目标：封装keepalive缓存组件，实现组件的缓存，并暴露相关方法，可以手动清除缓存。版本：Rea
转载
2023-12-11 12:14:37
78阅读
react其组件化的思想使得组件与组件间的通信变的十分必要，下要我们来分别介绍常见的react组件之间的通信方式。 一、父子组件 react是单向数据流，父组件在展示子组件时，可能会传递一些数据给到子组件。父组件通过过属性=值的形式传递给子组件数据，子组件通过props参数获取父组件传递过来的数据。而在某些情况下我们也需要子组件向父组件传递消息，这时同样需要用到props，父组件通过prop
转载
2024-06-22 16:11:35
45阅读
在 React 18 中新增加了很多 Hooks，其中包括 useSyncExternalStore()，它的作用是获取外部数据源。在一些状态管理库中，这个 Hooks 已经被广泛才用了。比如 Redux 内部就在使用它来实现选择器系统。那么我们如何在自己的代码中使用 useSyncExternalStore 呢？本文会演示一个例子，在这个例子中，Hooks 会触发无用的渲染。然后我会再通过 us
转载
2024-06-05 08:48:39
68阅读
重新设计 React 组件库
诚身
7 个月前 在 react + redux 已经成为大部分前端项目底层架构的今天，让我们再次回到软件工程界一个永恒问题的探讨上来，那就是如何提升一个开发团队的开发效率？ 从宏观的角度来讲，其实只有良好的抽象才能真正提高一个团队的开发效率，而囿于不同产品所面临的不同业务需求，当我们抽丝剥茧般地将一个个前端工程抽象到最后一层，那么剩下的其实就只有
转载
2024-08-26 10:07:51
61阅读
