面包屑 面包react antd
React的坑
1. react中没有computed属性,没有watch 这个很伤,简单的使用ES6 class的get属性,根本不能解决问题,setState之后,级联属性不能自动刷新视图 不用mobx,只能自己去setState依赖属性,而且依赖属性如果使用,state.属性名,去读取属性 则不能再setSt ......
react菜鸟教程笔记
https://www.runoob.com/react/react-state.html 1、状态和变量的使用 class Clock extends React.Component { // 变量存放--固定写法 constructor() { super(); this.state = {sh ......
react-native 调用手机自带分享
实现效果 import Share from 'react-native-share' import ViewShot from 'react-native-view-shot' const shotRef = useRef<ViewShot>(null) const getTime = () => ......
antd+vue3 tree-select 组件库 筛选结果不正确的问题
第一次遇到这种带搜索框的下拉树状列表搜索关键字的时候出现我不想要的结果。 我感觉组件它只是搜索一级列表而没有搜索二级列表,然后一节列表把它整个的二级列表带出来了。 二级列表里边包含搜索关键字的所有item才是我想要的。 相关代码: 1 <!-- 页面名称 --> 2 <div 3 class="no ......
react学习
react在前端中的地位 官网:https://zh-hans.react.dev/learn react是什么:用于构建 Web 和原生交互界面的库 邂逅react开发 声明式编程 组件化开发 跨平台编写 声明式编程:声明式编程是目前整个大前端开发的模式:Vue、React、Flutter、Swi ......
React jsx使用svg写法
使用svg的use时候,属性不能使用冒号写法,例如 sketch:type > sketchType xmlns:xlink > xmlnsXlink xlink:href > xlinkHref ......
React、Vue框架如何实现组件更新,原理是什么?
原文合集地址如下,有需要的朋友可以关注 [本文地址](https://mp.weixin.qq.com/s?__biz=MzI5MjY4OTQ2Nw==&mid=2247484356&idx=1&sn=10f0cc1989ce788e0b4bc166b2027b14&chksm=ec7cc090db ......
react项目中使用redux的实例
当在React项目中使用Redux,你需要安装redux和react-redux库。下面是一个简单的示例,展示了如何在React项目中集成Redux: #### 1.安装依赖库: `npm install redux react-redux` #### 2.创建Redux store: 在项目的根目 ......
React(二):JSX
一、什么是JSX JSX是一种将HTML和JavaScript结合的语法扩展,它允许在JavaScript代码中直接编写HTML标记。 上一节在学习元素渲染的时候就已经使用过JSX语法来进行元素的定义: const element = <h1>Hello React</h1>; 如上述语句所示,既不 ......
如何设置 antd protable中的搜索下拉框的宽度值为130
在 `Ant Design ProTable` 中,设置搜索栏下拉框的宽度稍有不同。受控于 `valueType` 属性中的 `select` 或其它类型,你可以在列定义中提供一个 `request` 函数来定义下拉选项,并且使用 `fieldProps` 来修改下拉选择的一些属性。 这就是如何在 ......
React(一):React元素渲染以及ReactDOM.render()方法
一、React的元素 1.React中元素是什么? 我的理解是元素是组成React应用的一个个的组成部分,是React中的基本单位,是一个用来描述DOM节点或React组件的普通JavaScript对象。 2.React中元素的特点 元素是不可变的,一旦创建就不能对它的属性或者内容进行修改 3.Re ......
用 React 写函数组件,如何避免重复渲染
参考: 用 React 写函数组件,如何避免重复渲染? - 挖个窟窿过年的回答 - 知乎 https://www.zhihu.com/question/442368205/answer/2590697263 一句话概括:memo、useMemo、useCallBack主要用于避免React Hook ......
antd table 动态添加数据时,上下行的输入框关联起来了
解决方法: 1、添加的对象必须在vue文件中,不能放在ts文件,或者说,添加的对象是新生成的 ``` const handleAdd = () => { const newData = { key: `${count.value}`, name: `Edward King ${count.value ......
在HTML中引入React和JSX
## 前言 Vue 可以非常方便地与 Pure HTML 结合,代替 jQuery 的功能,有一次遇到类似的场景时,我就想 React 能不能也以这种方式接入 HTML 网页,从而提高开发效率。 结果当然是可以的,只不过在 HTML 里直接 JSX 似乎会降低一些性能… 凑合用吧 ## 引入依赖 要 ......
React/Redux/React-Native 代码片段
# ES7+ React/Redux/React-Native 代码片段 ES7+ React/Redux/React-Native snippets 一个使用react开发的代码片段插件。 ## Snippets info 前置知识:代码片段中 每个花括号 `{ }` 和圆括号 `( )` 内部的 ......
antd table提示Warning: Each child in a list should have a unique "key" prop.
## 参考: [表中的每条记录都应该有一个唯一的“key”属性,或者将“rowKey”设置为唯一的主键。 · 问题 #7623 · ant-design/ant-design](https://github.com/ant-design/ant-design/issues/7623) ## 解决 ` ......
React18内核探秘:手写React高质量源码迈向高阶开发
第1章 课程简介 试看1 节 | 8分钟导学介绍课程内容,及你所获得~第2章 登高望远,手写源码前的思想准备8 节 | 54分钟建立全局观,为后续在源码中吸取精华做好思想准备,避免就源码而分析源码。第3章 原始版-初始化渲染:实现最原始的渲染过程11 节 | 122分钟实现初次渲染的基础逻辑,初步体 ......
在React之下,Context 或者 React-query库该如何选择
首先,如果是服务器的状态需要用React-query库最方便,如果是客户端的状态用local state + Context就可以了。 TRANSLATE with x English Arabic Hebrew Polish Bulgarian Hindi Portuguese Catalan H ......
antd from 表单中的key 不能绑定input中的字段 Input.js:207 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'value')
``` 删除 ``` ![](https://img2023.cnblogs.com/blog/2773051/202307/2773051-20230714091226247-504439371.png) 不然则会出现 Input.js:207 Uncaught (in promise) Type ......
React18+TS+NestJS+GraphQL 全栈开发在线教育平台
第1章 这里,将带你进行一次全面,高效的进阶 试看3 节 ‖ 36分钟学习本课程你能得到什么?不论是技术提升,职场晋升,面试跳槽,你都会有所收获。第2章 了解用户需求,懂得如何做项目 试看4 节 ‖ 54分钟本章让大家了解一个企业级项目的用户需求是什么,有哪几种角色,是如何使用我们的产品的,知道需求 ......
React18+Next.js13+TS,B端+C端完整业务+技术双闭环
新 React 技术栈,实战复杂低代码项目-仿问卷星第1章 开期准备 试看3 节 | 20分钟介绍课程内容,学习建议和注意事项。演示课程项目,让学员有一个整体的认识。第2章 【入门】什么是 React React 引领了现代前端开发的变革8 节 | 50分钟介绍 React 的历史、背景和每次版本更 ......
如何解决 React.useEffect() 的无限循环
[如何解决 React.useEffect() 的无限循环-react.useeffect](https://www.51cto.com/article/654928.html) 使用useEffect()时,你可能会遇到一个陷阱,那就是组件渲染的无限循环。在这篇文章中,会讲一下产生无限循环的常见场 ......
Ubuntu react nginx pc和mobile兼容
需求:有两个react前端,分别放在服务器的/var/www/pc目录和/var/www/mobile目录下,在nginx上根据用户浏览器类型跳转到不同的前端文件 网上的这个方法不行: server { listen 80; listen x.x.x.x; server_name www.xxxx. ......
react-d3-tree自定义节点使用案例
react-d3-tree 主要 API 及其中文解释: 1. Tree 组件的 props:这些 API 提供了丰富的配置选项,可以用来定制树的外观和行为。例如,可以使用 nodeSize 属性调整节点的大小,使用 pathFunc 属性绘制自定义的连线,使用 onClick 属性处理节点的点击事 ......
react 内容
1、初始安装react+ts npx create-react-app my-app npx create-react-app react-ts --template typescript 安装为ts 2、安装好react 后面加上ts 2.1 tsc --init 生产tsconfig.js { ......
2023 React 18 系统入门 进阶实战《欢乐购》
第1章 为什么越来越多的工程师选用 React 4 节|21分钟第2章 React 编程初体验 14 节|193分钟第3章 React 基础语法 17 节|271分钟第4章 React 高阶语法 13 节|235分钟第5章 React 中常见的 TypeScript 类型定义第6章 实战“欢乐购”: ......
React中编写操作树形数据的自定义Hook
### 什么是 Hook hook 即为钩子,是一种特殊的函数,它可以让你在函数式组件中使用一些 react 特性,目前在 react 中常用的 hook 有以下几类 - useState: 用于在函数组件中定义和使用状态(state)。 - useEffect:用于在函数组件中处理副作用,也可以模 ......
使用SpringBoot+React搭建一个Excel报表平台
> 摘要:本文由葡萄城技术团队于博客园原创并首发。转载请注明出处:[葡萄城官网](https://www.grapecity.com.cn/),葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。 # 前言 Excel报表平台是一款功能强大、操作简单的系统平台,可以帮助用户上传、编辑和分析 ......
React 中的 JS 报错及容错方案
## 前言 导致白屏的原因大概有两种,一为资源的加载,二为 JS 执行出错 本文就 JS 中执行的报错,会比较容易造成"**白屏**"场景,和能解决这些问题的一些方法,作出一个汇总 ## 常见的错误 ### SyntaxError > **`SyntaxError`**(语法错误)对象代表尝试解析不 ......