132浏览

0评论

React的特征单向数据流学习

目录正文状态 => 视图事件 => 状态改变 => 视图正文React推荐one-way单向数据流，注意只是推荐，并不强制，常见有以下两种情况:状态 => 视图事件 => 状态改变 => 视图状态 => 视...

• 2023-01-05

94浏览

0评论

React less 实现纵横柱状图示例详解

目录引言主要设计来源display 布局display 布局动态位置使用绝对定位styleJS引言之前的文章，咱们介绍过横向和竖向，具体的内容，请看React + CSS 绘制横向柱状图React + CSS 绘...

• 2023-01-05

96浏览

0评论

react-native 父函数组件调用类子组件的方法(实例详解)

react-native 父函数组件调用类子组件的方法，代码如下所示：import React, {Component} from 'react';import {Text, View, TouchableOpacity} from 'react-native';// 父let...

• 2023-01-05

105浏览

0评论

在React项目中使用TypeScript详情

目录项目目录及ts文件划分在项目中使用TypeScript具体实践组件声明React Hooks使用useStateuseRefuseCallbackuseMemouseContextuseReduceruseImperativeHandleAxios请求/响...

• 2023-01-05

111浏览

0评论

React.memo函数中的参数示例详解

目录React.memo？这是个啥？React.memo的第一个参数父组件子组件React.memo优化React.memo的第二个参数父组件子组件React.memo优化父组件子组件小结React.memo？这是个啥？按照官方...

• 2023-01-05

91浏览

0评论

React前端路由应用介绍

浏览器端的前端路由模式：hash模式，history模式安装路由模块路由模块不是react自带模块，需要安装第3方模块// react-router-dom 它现在最新的版本6
npm i -S react-router-dom@5...

• 2023-01-05

89浏览

0评论

react-native 实现渐变色背景过程

目录react-native 渐变色背景react-native学习记录滚动条轮播图示例渐变色ScrollableTabView默认页面ScrollableTabView背景颜色ScrollableTabView选中颜色ScrollableTabVie...

• 2023-01-05

104浏览

0评论

Vite+React搭建开发构建环境实践记录

目录前言使用 create-vite 脚手架生成基础模板eslintprettierreact-routerantd别名Less 与 CSS Module总结前言使用 Vite 已经有两年了，期间使用它开发过单页面应用，也开发过...

• 2023-01-05

89浏览

0评论

使用react-native-image-viewer实现大图预览

目录react-native-image-viewer大图预览先看一个实现的效果实例下面是一个简单的实例代码Propsreact-native-image-viewer大图预览在移动开发中，特别是涉及到图片的应用开发...

• 2023-01-05

106浏览

0评论

hooks中useEffect()使用案例详解

常见使用:获取数据案例:import React, { useState, useEffect } from 'react';import axios from 'axios';function App() { const [data, setData] = useState({ hits: []...

• 2023-01-05

105浏览

0评论

React特征Form 单向数据流示例详解

目录引言集中状态管理双向数据流那为何不选择双向数据流小结引言今天将之前的内容做个系统整理，结合 React Form 案例， 来了解下为何React推荐单向数据流，如果采用双向管理，可能...

• 2023-01-05

282浏览

0评论

React 错误边界Error Boundary使用示例解析

目录我们为什么需要错误边界如何使用错误边界组件使用错误边界需要注意什么我们为什么需要错误边界在React组件中可能会由于某些JavaScript错误，导致一些无法追踪的错误，导致...

• 2023-01-05

191浏览

0评论

React从命令式编程到声明式编程的原理解析

目录1 HTML 构建静态页面2 DOM 构建页面3 从命令式到声明式4 JSX5 总结6 完整代码这个系列的目的是通过使用 JS 实现“乞丐版”的 React，让读者了解 React 的基本...

• 2023-01-05

105浏览

0评论

react项目中@路径简单配置指南

目录前言1. 安装craco2.根路径下创建 craco.config.js3. 修改package.json文件的script字段4.使用补充：React 配置 @ 路径别名总结前言无论是vue还是react开发，我们通常需要引...

• 2023-01-05

103浏览

0评论

react装饰器与高阶组件及简单样式修改的操作详解

使用装饰器调用装饰器 用来装饰类的，可以增强类，在不修改类的内部的源码的同时，增强它的能力(属性或方法)装饰器使用@函数名写法，对类进行装饰，目前在js中还是提案，使用需要配置相...

• 2023-01-05

112浏览

0评论

一文详解React Redux使用方法

目录一、理解JavaScript纯函数1.1 纯函数的概念1.2 副作用概念的理解1.3 纯函数在函数式编程的重要性二、Redux的核心思想2.1 为什么需要 Redux2.2 Redux的核心概念2.2.1 st...

• 2023-01-05

125浏览

0评论

react中关于Context/Provider/Consumer传参的使用

目录Context/Provider/Consumer传参使用Context使用context向后代组件传参Context/Provider/Consumer传参使用react context这个api很少用到,所以一直不太清楚如何使用,最近...

• 2023-01-05

104浏览

0评论

使用react-native-doc-viewer实现文档预览

目录react-native-doc-viewer文档预览具体步骤如下react-native初体验的总结一、前提知识点二、开发前后相关的一些配置三、开发项目中用到的知识四、ui库五、项目搭建六、...

• 2023-01-05

89浏览

0评论

React Hook 父子组件相互调用函数方式

目录React Hook 父子组件相互调用函数1.子组件调用父组件函数方法2.父组件调用子组件函数方法React Hook 父子组件传值父组件子组件React Hook 父子组件相互调用函数1.子组...

• 2023-01-05

103浏览

0评论

React Hook父组件如何获取子组件的数据/函数

目录React Hook父组件获取子组件数据/函数子组件MyWorldMap父组件MyTripReact Hook父组件提交子组件form父组件子组件React Hook父组件获取子组件数据/函数我们知道在react...

• 2023-01-05

104浏览

0评论

React特征学习Form数据管理示例详解

目录Form数据管理重置Form状态form验证小结Form数据管理有时会遇到多个位置需要用户输入的情况，若每个状态都配置state或handler会很繁琐，可以尝试下面的方法import * as Reac...

• 2023-01-05

108浏览

0评论

Ant Design中使用css切换的问题及解决

目录Ant Design使用css切换问题1、绑定一个自定义属性2、css模块化3、Ant Design主题方案4、css in js ant design中css样式覆盖问题Ant Design使用css切换问题当想通过开关...

• 2023-01-05

105浏览

0评论

react  Suspense工作原理解析

目录Suspense 基本应用Suspense 原理基本流程源码解读 - primary 组件源码解读 - 异常捕获源码解读 - 添加 promise 回调源码解读-Suspense首次渲染primary 组件加载完成前...

• 2023-01-05

120浏览

0评论

React Native Modal 的封装与使用实例详解

目录背景Android FullScreenModal 的封装使用Android 原生实现全屏 Dialog封装给 RN 进行相关的调用Android 原生部分实现JS 部分实现使用 RootSiblings 封装 Modal实现界面...

• 2023-01-05

126浏览

0评论

React 性能优化方法总结

目录前言为什么页面会出现卡顿的现象？React 到底是在哪里出现了卡顿？React 有哪些场景会需要性能优化？一：父组件刷新，而不波及子组件。第一种：使用 PureComponent第三种：函数组件如...

• 2023-01-05

101浏览

0评论

React中Suspense及lazy()懒加载及代码分割原理和使用方式

目录React.lazy()概括为什么需要懒加载如何进行代码分割SuspenseSuspense应用场景Suspense实现原理总结Suspense和lazy()都是react中比较新的特性,在项目中使用还比较少,但...

• 2023-01-05

102浏览

0评论

React组件封装中三大核心属性详细介绍

目录1、介绍2、state概念演示3、props概念props与state区别4、refs概念refs种类5、父子组件什么是父子组件父子组件之间传值1、介绍React组件中默认封装了很多属性，有的是提...

• 2023-01-05

110浏览

0评论

react使用websocket实时通信方式

目录使用websocket实时通信创建公共组件在react组件中的使用websocket在不同情形下的使用1.在react中使用websocket2.websocket在小程序中使用使用websocket实时通信在react...

• 2023-01-05

121浏览

0评论

2022最新前端常见react面试题合集

目录react性能优化方案什么是 React Context?何为 JSXprops 是什么应该在 React 组件的何处发起 Ajax 请求react 强制刷新使用 React Hooks 好处是啥？Redux内部原理 内部怎么...

• 2023-01-05

119浏览

0评论

React特征学习之Form格式示例详解

目录Form 样式React hookForm 样式首先来看一个简单Form, 式样如下import * as React from 'react';const LoginForm = () => { return ( <form> <div> //...

• 2023-01-05

118浏览

0评论

详解React Native项目中启用Hermes引擎

目录引言一、启用 Hermes 引擎1.1 Android1.2 iOS二、Hermes 引擎使用2.1 检查 Hermes 引擎是否启用2.2 绑定Hermes2.3 使用DevTools在Hermes上调试JS引言目前，最新版本的Rea...

• 2023-01-05

115浏览

0评论

sass在react中的基本使用(实例详解)

目录1. 安装sass2. 编写App.tsx中的基本DOM3. sass变量4. sass中的选择器嵌套和属性嵌套5. sass中的@import和Partials6. Sass中的 @mixin 与 @include7.sass中的继承 @exte...

• 2023-01-05

101浏览

0评论

React组件间传值及跨组件通信详解

目录组件间传值propsref状态提升跨组件通信组件间传值props父传子：通过自定义属性向子组件传值，值可以是任何类型子传父：通过父组件把方法传给子组件，子组件调用传过去的方法完...

• 2023-01-05

120浏览

0评论

React如何接收excel文件下载导出功能封装

目录React接收excel文件下载导出功能封装react导出excel文件的几种方式1.原生js导出 （带样式）2.使用xlsx导出（此方法导出的excel文件无样式,但导出的文件格式是 xlsx格式） 3.使...

• 2023-01-05

120浏览

0评论

react Scheduler 实现示例教程

目录正文简单的css动画etTimeout来实现循环处理具体思路正文最近在看react源码，react构建fiber树这一块逻辑还比较好理解，但是一旦涉及到任务调度相关的逻辑，看起来是一头雾水...

• 2023-01-05

105浏览

0评论

在 React 项目中全量使用 Hooks的方法

目录前言React HooksuseStateuseReducer基础用法进阶用法useContextuseEffectuseLayoutEffectuseRefuseImperativeHandleuseCallbackuseMemoReact Redux Hooks useSelectoru...

• 2023-01-05

133浏览

0评论

在react中使用tailwind的问题

目录react使用tailwind效果图react使用tailwind现创建react项目npx create-react-app name进入创建的项目文件夹，安装tailwind,postcss,autoprefixer因为react自带安装了上一...

• 2023-01-05

222浏览

0评论

React css-in-js基础介绍与应用

目录1. 介绍2. 使用1. 介绍CSS-in-JS 是一种技术，而不是一个具体的库实现。简单来说 CSS-in-JS 就是将应用的CSS样式写在 JavaScript 文件里面，而不是独立为一些 css，scss 或 l...

• 2023-01-05

114浏览

0评论

Redux thunk中间件及执行原理详细分析

目录1、Redux-thunk中间件2、Redux中间件执行原理1、Redux-thunk中间件第一步 安装redux-thunk中间件npm install redux-thunk第二步 在store中引入thunk组件import {create...

• 2023-01-05

110浏览

0评论

React state状态属性详细讲解

目录1. 基本使用2. 使用setState操作state数据3. 案例-toDoList4. 案例-购物车1. 基本使用要点：成员属性 state 它是一个特殊的属性，它是当前类的私有数据，只有在当前的组件中...

• 2023-01-05

126浏览

0评论

react框架next.js学习之API 路由篇详解

目录正文使用方式API 路由匹配API 处理API 配置边缘计算支持自定义 API注意点总结正文next.js 作为最热门的 react 框架，不过这么久了好像国内使用率一直不太高。最近在研究...

• 2023-01-05

123浏览

0评论

React 跨端动态化核心技术实例分析

目录一 前言二 React 技术核心优势分析1 数据驱动模型2 从 JSX 到虚拟 DOM3 独立事件系统三 React 能为跨端动态化做些什么？1 React 语法做 DSL2 保留 React 运行时3 React...

• 2023-01-05

111浏览

0评论

详解React获取DOM和获取组件实例的方式

目录React获取DOM的方式ref获取DOM元素ref获取组件实例React获取DOM的方式ref获取DOM元素在React的开发模式中，通常情况下不需要、也不建议直接操作DOM原生，但是某些特殊的情...

• 2023-01-05

106浏览

0评论

新建的React Native就遇到vscode报警解除方法

目录新建的RN项目有警告直接删除vscode报警的部分禁掉vscode内置的TypeScript插件引入Flow Language Support解除报警新建的RN项目有警告我相信AwesomeProject是很多人的第...

• 2023-01-05

122浏览

0评论

详解React Native中如何使用自定义的引用路径

目录RN的相对路径地狱RN的自定义路径需要的依赖解决自定义引用路径导致的eslint报错问题RN的相对路径地狱我刚接触RN时，就发现所有的demo中给出来的路径都是相对路径，我自己的...

• 2023-01-05

141浏览

0评论

React路由渲染方式与withRouter高阶组件及自定义导航组件应用详细介绍

目录1. 路由的三种渲染方式1.1 component渲染方式1.2 render方式渲染1.3 案例-登录成功才能访问某个页面1.4 children方式渲染2. withRouter高阶组件3. 自定义导航组件1. 路...

• 2023-01-05

129浏览

0评论

React路由规则定义与声明式导航及编程式导航分别介绍

目录1. 路由使用2. 声明式导航3. 编程式导航1. 路由使用安装路由模块：路由模块不是react自带模块，需要安装第3方模块：yarn add react-router-dom@5路由相关组件：路由模式组件：包...

• 2023-01-05

116浏览

0评论

React网络请求发起方法详细介绍

目录1. 发起网络请求2. 开发时网络请求代理配置1. 发起网络请求首先需要安装 axios 库：yarn add axios发起网络请求：import React, { Component } from 'react'import { get }...

• 2023-01-05

108浏览

0评论

React事件处理超详细介绍

目录1. 事件绑定1.1 函数组件1.2 类组件2. 合成事件3. 事件传参的3种不同写法4. this 指向问题1. 事件绑定React 元素的事件处理和 DOM 元素的很相似，但是有一点语法上的不同...

• 2023-01-05

126浏览

0评论

React-hooks面试考察知识点汇总小结(推荐)

目录什么是hooks？解决了什么问题？Hook 简介Hook APIuseState指定初始 state惰性初始化自定义 Hook什么是hooks？解决了什么问题？Hooks 是react16.8新增特性，它可以使用一些state的...

• 2023-01-05