面包屑 面包react antd

React Native 备忘清单_开发速查表分享

React Native 备忘清单 适合初学者的综合 React Native 备忘清单,在开始 React Native 之前需要先掌握 react 库入门,为开发人员分享快速参考备忘单。 React Native (简称RN)是Facebook于2015年4月开源的跨平台移动应用开发框架,是Fa ......
清单 Native React

react 入门

react三大属性 一.状态 类组件1. state 是组件的属性,值是对象。state中的数据是可读可写的,通过更新state来更新对应的页面显示(重新渲染组件),通过setState来更新state数据且更新是一种合并 ,在类组件中使用.组件自定义的方法中this为undefined(1)强制绑 ......
react

react设置滚轮横向滚动

1.准备 import React, { useRef, useEffect } from 'react'; const useHorizontalScroll = ({ children, ...layoutProps }) => { const elRef = useRef(); useEffe ......
滚轮 横向 react

React 编程思想 #2

React 编程思想 #2 接上文,已经实现了一个静态的页面,现在就要给页面加上交互了。 寻找 State 状态是应用需要记录的最小变化,构建状态的最重要的原则是 DRY(Don’t Repeat Yourself,不要重复自己)。对于一个应用,构建出它的状态的绝对最小表示,并通过这些状态计算其他需 ......
思想 React

前端React框架和jsx语法的编码规范

基本规则(Basic Rules) 每个文件只包含一个 React 组件 然而,在一个文件里包含多个没有 state 或纯组件是允许的。eslint: react/no-multi-comp. 经常用 JSX 语法。 不要用 React.createElement, 除非你从一个非 JSX 文件中初 ......
前端 语法 框架 编码 React

react useCreateWatchedStore 轻量级高性能状态管理库

import {useContext, useEffect, useMemo, useRef, useState} from 'react'; import _get from "lodash.get"; import _set from "lodash.set"; import {shallowE ......

vue或者react中的hooks的理解

我们听过react 里面有hooks的概念,那么怎么理解hooks呢? 其实vue2中,我们没有hooks的概念,vue3中我们引入了组合式函数(也就是用组合式api写的),它其实就是vue的hooks。 总结下来,hooks有以下特点: 1、hooks其实就是个函数,只是实现它的方法比较特殊,利用 ......
react hooks vue

React 笔记

Date: 2023-03-30 20:36:05 视频链接:尚硅谷React教程 开始学 react 了,😆 P1 react 简介 React 只关注视图,不关心数据 笔记基于版本 react@16,在记录过程中引入并使用高版本特性 P2 react 案例 babel.min.js \\ 用来 ......
笔记 React

react useEnhancedState

import {useCallback, useRef, useState} from 'react'; import {shallowEqual} from "../utils/shallowEqual"; function useEnhancedState(initialState: any) ......
useEnhancedState react

react useComparedState

import {useCallback, useRef, useState} from 'react'; import {shallowEqual} from "../utils/shallowEqual"; function useComparedState(initialState: any) ......
useComparedState react

React Router 备忘清单_开发速查表分享

React Router 备忘清单 IT宝库整理的React Router开发速查清单适合初学者的综合 React Router 6.x 备忘清单入门,为开发人员分享快速参考备忘单。 开发速查表大纲 入门 安装使用 添加路由器 根路由 处理未找到错误 contacts 用户界面 嵌套路由 客户端路由 ......
清单 Router React

React 编程思想 #1

React 编程思想 #1 看太多语法,都不如简单尝试一下,跟着官方文档做了一下 DEMO,文档写的真不错,就是没翻译完,一大半都还是英文(×_×),本篇其实大部分也是在重复文档内容,不过加上了自己的尝试。 从原型开始 React 可以改变你对所看到的设计以及所构建的应用程序的看法。以前你看到的是一 ......
思想 React

react-ace踩坑记录

使用 diffEditor 时,文档上获取 diff 未导出 // 在 6.0版本时会出现这个问题 import { diff as DiffEditor } from "react-ace"; // 文档错误写法 import DiffEditor from "react-ace/lib/diff ......
react-ace react ace

react v6路由传参

1. params参数 形式:/home/1/aa // 声明式导航 <Link to={`home/${id}/${name}`}> // 编程式导航 navigate(`page/${id}/${name}`); ... // 需要在路由里声明传参的key值 <Route path="home/ ......
路由 react

react-markdown的使用

react-markdown的使用 安装 npm i react-markdown 基本使用 import ReactMarkdown from 'react-markdown' const markdownData = ` ### test header ` <RactMarkdown> {mar ......
react-markdown markdown react

选择Kendo React PDF查看器的几个理由,一定要看!

Kendo UI致力于新的开发,来满足不断变化的需求,通过React框架的Kendo UI JavaScript封装来支持React Javascript框架。Kendo UI for React能够为客户提供更好的用户体验,并且能够更快地构建更好的应用程序。 虽然查看PDF可能不是开发人员最需要关 ......
理由 Kendo React PDF

React Hook useState 视图不更新

React Hook useState 页面不刷新,基础类型的值没有这个困扰,对象、数组要麻烦点。 App 组件有两个子组件,该组件使用了状态提升管理两个子组件依赖的数据,子组件 ProductList 点击按钮之后需要更新 trolleyList 的长度。 App.tsx: function Ap ......
视图 useState React Hook

[React] Composable component with Context

ProductCard component import './ProductCard.css'; import { ReactNode } from 'react'; import * as React from 'react'; import ProductCardContext from '. ......
Composable component Context React with

React状态 和 JavaScript箭头函数

React状态 和 JavaScript箭头函数 在看 React 的状态时见到了 JS 的箭头函数,一时间没看明白。 React 状态 React 把组件看成是一个状态机(State Machines)。通过与用户的交互,实现不同状态,然后渲染 UI,让用户界面和数据保持一致。 在 React 中 ......
箭头 JavaScript 函数 状态 React

Gitlab CI/CD of react app in docker container 用gitlab CI/CD部署docker container react app

1.0 Download project git clone http://oauth2:{token}@{host}/{user}/{project} {dir_folder} download project to target server 2.0 Install gitlab runner ......
container docker react app Gitlab

react组件传值

1. 父子传值 父传子使用props,父组件更新视图改变props子组件会同步更新。 类组件 import React, { Component } from 'react'; class Father extends Component { state={ count: 0 } render(){ ......
组件 react

antd 修改组件样式除了在全局修改还有其他方法

修改input 框的 border-radius 第一步 安装less yarn add less less-loader --save-dev 第二步 在需要修改的文件下新建antdStyle.less 配置 antdStyle.less 在文件引入@import '~antd/dist/antd ......
全局 样式 组件 方法 antd

思考 React Hook 和 Vue 组合式 API

Vue 组合式 API 优化周期函数 Vue2 选项 API 一个组件的周期函数只能有一个,比如 mounted 周期中有很多获取数据的逻辑都在这里,在 updated 周期中又有很多更新的逻辑在这里。 选项 API: export default { data() { return { a: 1, ......
React Hook API Vue

react生命周期

componentWillMount:16版本就废弃了,相当于Vue中created; componentDidMount: 会在组件挂载后(插入DOM中)立即调用;相当于Vue中的onMounted; componentDidUpdate(prevProps, prevState, snapsho ......
周期 生命 react

面包板使用教程 All In One

面包板使用教程 All In One (🐞 反爬虫测试!打击盗版⚠️)如果你看到这个信息, 说明这是一篇剽窃的文章,请访问 https://www.cnblogs.com/xgqfrms/ 查看原创文章! 面包板 导通图解 揭开面包板背面的双面胶贴纸 ✅ https://youtu.be/spOV ......
面包 教程 All One In

万字血书React—走近React

配置开发环境 脚手架工具create-react-app 储备知识:终端或命令行、代码编辑器 React官方中文文档 create-react-app 其是基于Node的快速搭建React项目的脚手架工具。 npx create-react-app testdemo cd testdemo npm ......
血书 React

react根据antd下拉框监听事件带出表单输入框值

// 招待费根据招待人数,陪同人数,人均标准自动带出申请金额 peopleChange = (value,field) => { const {form} = this.props if (value null) { form.setFieldsValue({amount: 0}) return } ......
表单 事件 react antd

若依框架-侧边栏、导航栏、面包屑样式修改

修改【若依框架】的侧边栏、导航栏、面包屑样式、修改全局页面样式 说明:只运行前端项目,只需要要下载官方项目http://www.ruoyi.vip/ 修改vue.config.js文件中的target: `http://localhost:8080`为: target: `http://vue.ru ......
面包屑 侧边 样式 框架 面包

React Hook 中 useState 异步回调获取不到最新值及解决方案

预先了解 setState 的两种传参方式 1、直接传入新值 setState(options); 列如: const [state, setState] = useState(0); setState(state + 1); 2、传入回调函数 setState(callBack); 例如: con ......
useState 解决方案 方案 React Hook

开源: golang+vue的论坛 和 node+react的IM系统

最近基于开源做了两个自己系统 都是UI非常好看的 我将两个系统的数据互通了 附带了一些产品思考 只需要一个邮箱就可以登录 无密码 无手机号 尽量简化流程 第一个论坛 站点 https://bulita.cn 现在主要是聚合招聘信息 目标是尽可能降低招聘和求职的门槛 以上海和远程工作为主 开源地址 h ......
golang 系统 react 论坛 node