面包屑 面包react antd
React（三）：Hello,React
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>helloReact</title> <script src="https://unpkg.com/react@18/umd/react.development.js"></scr ......
React18学习笔记
## 目录 - [使用Create-React-App创建项目](#使用Create-React-App创建项目) - [使用Vite创建项目](#使用Vite创建项目) - [JSX语法基础](#JSX语法基础) - [标签](#标签) - [属性](#属性) - [事件](#事件) - [插入J ......
解密Prompt系列12. LLM Agent零微调范式 ReAct & Self Ask
这一章我们正式进入大模型应用，聊聊如何把思维链和工具使用结合得到人工智能代理。先介绍基于Prompt的零微调方案Self Ask和React，我们会结合langchain写个简单的Agent来玩一玩 ......
antd的a-table选中复选框后，删除操作还仍然存在选中项的问题暴力解决法
``` 在antd的a-table中有复选框，选中后进行操作，比如删除，刷新后竟然还存在选中了的情况，这显然不合理，选中的参数是否清空或者拿到的就是选中的参数，都需要查看一边，查了一堆解决办法，试了一下，不行，不知道是不是vue3的情况就不行。 网络中的方案大多都是: const rowSelect ......
react ts 父组件调用子组件方法，父子通信
## 子组件 > GlobalTableWapper：css 盒子 IProps, ChildMethods：字段类型 ```ts import React, { forwardRef, memo, useEffect, useImperativeHandle, useState } from 'r ......
react antd5 分页英文，设置中文
## 使用 ConfigProvider 包裹住英文组件，或者包裹根目录 ```js import { ConfigProvider } from 'antd'; import zhCN from 'antd/locale/zh_CN'; `共 ${total} 条`} /> ``` - antd ......
React主要用于构建UI，React UI框架使交互式的UI变得容易
优秀的 React UI框架，可以为你节省开发时间、提高开发效率，统一设计语言。还在为你的项目寻找高质量的 React UI 框架吗？为了让你更轻松地找到好用的UI框架，Pixso精心挑选了6个优秀的React UI框架选项，并展开诉说了每个 UI 框架的不同功能和用户友好性，以便你可以选择最适合你 ......
react useEffect a页面跳转b页面，b页面跳转a页面，接口调用多次
react useEffect a页面跳转b页面，b页面跳转a页面，接口调用多次 useEffect(() => { xxx(); return () => { history?.go(0); }; }, []); 我的解决方式是在，在离开页面之前触发return () => {history?.g ......
React技术文档(一)
# React技术文档(一) ## 安装 - 全局安装react脚手架 ```js npm i -g create-react-app ``` - 查看react安装版本 ```js create-react-app -V ``` - 进入目标文件夹下创建react项目 ```js create-r ......
React技术文档(二)
React技术文档(二) # 事件绑定 ## 事件绑定的写法 在react中于需要绑定事件的节点上采用on+事件名驼峰写法定义,如`onBlur onClick onInput` 事件命名法 ```js import React, { Component } from 'react' export ......
antd 改变导航菜单的样式
```js // 设置菜单样式 .ant-menu,.ant-menu-sub,.ant-menu-inline{ color: var(--white); background-color: ${bgColor} !important; } // 设置子菜单展开样式 .ant-menu-subme ......
如何编写难以维护的React代码？耦合组件
# 如何编写难以维护的React代码？耦合组件 在许多项目中，我们经常会遇到一些难以维护的React代码。其中一种常见的情况是：子组件直接操作父组件方法，从而导致父子组件深度耦合。这样的实现让子组件过于依赖父组件的具体实现细节，使得代码难以维护和扩展。 让我们来看一个例子： ```jsx funct ......
react antd5 Warning: Each child in a list should have a unique "key" prop.
## Warning: Each child in a list should have a unique "key" prop. 
 [OpenTelemetry](https://opentelemetry.io/) 可用于跟踪 `Rea ......
React组件设计之性能优化篇
>我们是[袋鼠云数栈 UED 团队](http://ued.dtstack.cn/)，致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神，探索前端道路，为社区积累并传播经验价值。 >本文作者：空山 # 前言 > 由于笔者最近在开发中遇到了一个重复渲染导致子组件状态值丢失的问题，因此关于性能优化 ......
React Native热更新报错：The "CFBundleShortVersionString" key in the "ios/***/Info.plist" file needs to specify a valid semver string
React Native项目集成了CodePush热更新，在用cpcn-client工具发布新版本时，在日志栏中打印了如下错误： Detecting ios app version: The "CFBundleShortVersionString" key in the "ios/xxx/Info. ......
如何编写难以维护的React代码？——滥用useEffect
# 如何编写难以维护的React代码？——滥用useEffect 在许多项目中，我们经常会遇到一些难以维护的React代码。其中一种常见的情况是滥用useEffect钩子，特别是在处理衍生状态时。让我们来看一个例子： ```jsx const ComponentA = ({ list }) => { ......
antd 合并表格的最后一列，且增加点击事件
实现：antd（版本1.7.8） + vue 实现如下，点击 导出 导出该表格为excel table的columns里最后一列的操作这样写： 在customRender里写合并最后一列的方法： 判断index等于0，也就是第一行，进行行的合并，并且返回这一行的内容，是一个导出的链接，方法是expr ......
antd 组件 select input cheeckboxGround 传参 自定义传参
temp  func ![](https://img2023.cnblogs.com/blog/2773051/2 ......
React Native集成CodePush热更新遇到的坑，以及折腾过程。"CFBundleShortVersionString" key needs to specify a valid semver string
最近开始一个React Native的新项目。按惯例，在创建完项目后，先集成CodePush热更新功能。 这种活已经干过不止一两次了，当然没啥问题，直接上手开干。 可问题恰恰出在了本以为应该很顺利的地方。 首先，在用 cpcn-client 工具给项目安装 cpcn-react-native 包时， ......
React函数式组件渲染、useEffect顺序总结
> 参考资料： [深入React的生命周期(上)：出生阶段(Mount)](https://zhuanlan.zhihu.com/p/30757059) [深入React的生命周期(下)：更新(Update)](https://www.v2think.com/dig-into-react-lifec ......
React函数式组件渲染顺序探究（Demo）
> 参考资料： > [React渲染顺序及useEffect执行顺序探究（含并发模式）](https://blog.csdn.net/web2022050901/article/details/125238225) # code ```jsx import { useEffect, useState ......
react 项目内存放excal文件并实现下载功能
typings.d.ts配置(使用typescript) 在umi+ts搭建的react项目内，没有对.xlsx文件进行处理是没办法通过文件导入获取到改文件的，可以在typings.d.ts文件内根据实际情况进行后缀添加，否则ts会报导入错误 1 declare module "*.png"; 2 ......
响应式系统与 React
### 0x1 React 的历史与应用 1. 应用场景 1. **前端应用开发**，如 Meta、Ins、Netflix 的网页版 2. **移动原生应用开发**，如 Ins、Discord 3. 结合 Electron 进行**桌面应用开发** 2. 发展历史 1. Facebook 引入了 x ......
关于Antd中table列Fixed导致的expandedRowRender展开行错位问题
右侧操作列的属性为fixed：'right'在展开行时出现列错位的问题 打开element发现列属性设置为fixed后在DOM中是独立出来的 解决办法： <a-table :columns="columns" :data-source="data" bordered :pagination="fal ......
react批量生成pdf
使用`htmlpdf.js`批量将`html`页面转为`pdf`，打包成`zip`下载。`htmlpdf.js`是结合`html2canvas`和`jsPDF`实现的。 首先先安装包 ``` npm install --save html2pdf.js ``` 基本页面 ``` import htm ......
解决 react antdPro umi 报错 error:0308010C:digital envelope routines::unsupported
修改文件：package.json 原 "start": "umi dev", 改成 "start": "SET NODE_OPTIONS openssl-legacy-provider && umi dev", ......
vue3+antd-vue实现增改弹窗
对于前端来说，在后台系统中最常见的需求，就是基于表单表格的正删改查。对于增和改，需要实现弹框组件。代码如下： ``` ``` ###使用方法： ###模板使用组件 ``` ``` ###控制打开弹窗 ``` 编辑 ``` ###js const classModal = ref(null) func ......
【antd】Table 全选框部分禁用
const rowSelection = userInfo.isManager == 1 || userInfo.isSuperAdmin == 1 ? { onChange: (selectkeys) => { setSelectedRowKeys(selectkeys) }, } : { onC ......