1. 根据后端返回的dataMenu数组的id值，来获取dataList数组中对应的id的数据，按后端返回id顺序进行渲染数据技术使用：find() 方法返回符合指定条件（函数内判断）的数组的第一个元素的值const dataMenu= [1,3]
const dataList = [{
id: 1,
name: '测试测试'
},{
id: 2,
name: '测试测
转载
2024-05-29 06:31:35
0阅读
使用 react 的 hooks 进行全局的状态管理React 最新正式版已经支持了 Hooks API，先快速过一下新的 API 和大概的用法。// useState，简单粗暴，setState可以直接修改整个state
const [state,setState] = useState(value);
// useEffect，支持生命周期
useEffect(()=>{
// sub
转载
2024-02-09 08:09:09
71阅读
每日前端夜话第357篇
正文共：3740 字预计阅读时间：10 分钟 自 Hook 被引入 React 以来，Context API 与 Hook 库在应用状态管理中被一起使用。但是把 Context API 和 Hooks(许多基于 Hooks 的状态管理库建立在其基础上)组合的用法对于大规模应用来说可能效率不高。由于必须创建一个自定义的 Hoo
转载
2024-06-04 14:54:49
41阅读
React - Context 使用（共享对于一个组件树而言是 “全局” 的数据）一. Context 概念理解二. Context 使用三. Context 组件传值实例 Context官网： https://zh-hans.reactjs.org/docs/context.html一. Context 概念理解
Context 提供了一个无需为每层组件手动添加 props，就能在组件树间进行
转载
2024-07-05 07:31:10
92阅读
想了解更多—> 上一篇文章：React简介（二）：React组件的生命周期React 把组件看成是一个状态机（State Machines）。通过与用户的交互，实现不同状态，然后渲染 UI，让用户界面和数据保持一致。React 里，只需更新组件的 state，然后根据新的 state 重新渲染用户界面（不要操作 DOM）。以下实例创建一个名称扩展为 React.Comp
转载
2024-06-08 12:20:06
52阅读
react dva 异步数据state 传入组件，用props初始化组件state失败
先上结论，不是取不到，是写法有问题。全文分4部分，1是问题描述，2是一开始的解决想法（错误做法），3是问题产生原因的思考，4是正常解决方法。只想看结论直接跳41.问题描述 接触react dva一个月，和同事都不算熟悉框架。在修改、使用同事的ui组件时，想用全局mo
转载
2023-12-06 20:04:27
61阅读
使用 react 的 hooks 进行全局的状态管理React 最新正式版已经支持了 Hooks API，先快速过一下新的 API 和大概的用法。// useState，简单粗暴，setState可以直接修改整个state
const [state,setState] = useState(value);
// useEffect，支持生命周期
useEffect(()=>{
/
转载
2024-01-15 09:03:42
49阅读
React是React库的入口。如果你通过一个script标签使用的React，那么它的顶级API都会在全局环境下一个名称为React的变量上。如果你是通过npm使用的ES6，你可以这样写：import React from 'react';。你是通过npm使用的ES5，你可以这样写var React = require('react');。 总览 ComponentsReact.Componen
使用mui的Snackbar思路 暴露一个 ref 需要通知的时候调用 组件暴露的方法import\
原创
2023-02-13 20:17:20
367阅读
componentimport React, { forwardRef, useImperativeHandle, useCallback } from "react";import { Button,
原创
2023-02-14 09:30:26
405阅读
一、是什么组件式开发选择合适的css解决方案尤为重要通常会遵循以下规则：可以编写局部css，不会随意污染其他组件内的原生；可以编写动态的css，可以获取当前组件的一些状态，根据状态的变化生成不同的css样式；支持所有的css特性：伪类、动画、媒体查询等；编写起来简洁方便、最好符合一贯的css风格特点在这一方面，vue使用css起来更为简洁：通过 style 标签编写样式scoped 属性决定编写的
转载
2024-09-12 12:27:53
95阅读
写于：2017-1-18完整干净demo地址：coding.net/u/java_luo/p/react_luo/git技术栈： react，redux，webpack，eslint，babel，antd(蚂蚁金服ui)1、前期准备①、windows系统，本框架是在windows系统下配置的 ②、SublimeText， 用的这个编辑器 ②、安装node.js ③、创建一个文件夹，用nod
随着 react@16.8 hooks 的正式发布，如何优雅的使用 hooks 成了值得我们考虑的问题，在此我不再赘述 hooks 给 react 的写法带来的改变，而是介绍一个新的 hook。试想有这样一个 hook const { user } = useProps('user'); 如果我们有这样一个 hook，可以在全局的 store 中得到变量，同时解决了 useSta
# 在 React 项目中全局引入 jQuery 的方法
## 1. 流程概览
在将 jQuery 引入到 React 项目中之前，了解整个流程是非常重要的。下面是实现这一目标的简要步骤：
| 步骤 | 描述 |
| --- | --- |
| 1 | 创建一个新的 React 项目 |
| 2 | 安装 jQuery 库 |
| 3 | 在项目中全局引入 jQuery |
| 4 | 编写
原创
2024-10-29 04:13:06
54阅读
1、React中错误异常捕获在 React 中，可以通过 Error Boundaries（错误边界）来捕获错误异常。Error Boundaries 是一种 React 组件，它可以在其子组件树的渲染期间捕获 JavaScript 异常，并且可以渲染出备用 UI。React 提供了两个生命周期方法来处理错误边界：componentDidCatch 和 getDerivedStateFromErr
转载
2024-04-16 12:11:35
157阅读
目录一、定义变量修饰符二、变量赋值三、变量添加默认值四、方法默认参数五、import引入问题七、获取某个dom节点八、类型检测九、获取路由的参数十、页面跳转十一、箭头函数十二、组件间的通信一、定义变量修饰符1、const：定义常量时用const name = “weishihuai”; //const表示常量，类似java的final name = “hello weishihuai”; //编译
一、React概述React是一个是一个开源的js库，用来为数据渲染视图的，由facebook，Instagram社区维护的。（例如美团、阿里、airbnb都在使用React开发）为什么会出现React：频繁的数据操作-->① 大量的DOM操作（自动操作DOM）；②逻辑会比较复杂（状态与内容对应起来）React发展历史：2011年 react受php当中xhp框架的影响，部署在faceboo
转载
2024-06-20 04:52:29
95阅读
# React Axios全局跨域实现方法
## 1. 前言
在前端开发中，我们常常需要与后端进行数据交互。而在开发过程中，经常会遇到跨域请求的问题，特别是在使用React框架的时候。本文将介绍如何使用React和Axios进行全局跨域请求。
## 2. 什么是跨域请求
跨域请求指的是在浏览器中，使用JavaScript发起的请求，目标地址与当前页面的域名、协议或端口不同。由于浏览器的同源
原创
2023-09-09 16:28:43
173阅读
大纲React 开发和生产环境捕获异常的实现不同如何捕获异常，同时不吞没用户业务代码的异常如何模拟 try catch 捕获异常React 捕获用户所有的业务代码中的异常，除了异步代码无法捕获以外。React 使用 handleError 处理 render 阶段用户业务代码的异常，使用 captureCommitPhaseError 处理 commit 阶段用户业务代码的异常，而事件处理函数中的
转载
2024-06-23 14:41:21
57阅读
renderBreadcrumb() { const {routes} = this.props; const items = routes.map((route, idx) => { let content = null; if (idx == 0) { content = ...
原创
2022-05-05 12:15:14
936阅读
