react

```js 第一步: 创建仓库 vuex ===== redux 1, 下载安装 redux 模块 和 react-redux模块 cnpm install redux --save cnpm ins

```js mobx状态管理实现有两种写法: 装饰器写法和非装饰器写法, 官方推荐使用装饰器语法 (一): 非装饰器语法: 1, 下载安装模块 mobx 和 mobx-react cnpm i mob

```js 提示: 此教程使用react-router 6.5 版本 + hooks 语法实现 1, 下载react的路由模块(默认最新6.5) npm install react-router-do

```js // 在react-router6.0中所有的组件都没有路由信息,也没有widthRouter, 需要使用hooks语法引入路由信息, 所以,我们可以自己封装withRouter高阶组件

```js 什么是hooks? // hooks是react新版本提供的组合式API语法, 类似于vue3组合式API // hooks有什么用? // 使函数式组件拥有组件状态和生命周期功能, 避免

```js //一,高阶组件(Higher Order Component,简称:HOC ): 是 React 中用于重用组件逻辑的高级技术, 它本身不是react中的组件, 而是一个函数, 这个函数

```js 1, 在react工程中下载安装过渡动画模块 npm install react-transition-group --save 2, 在路由配置文件/src/router/index.j

```js 1, 在react工程中下载安装过渡动画模块 cnpm install react-transition-group --save 2, 在需要执行过渡的组件中导入动画模块 import

```js (一): 局部路由监听: 1, 在路由跳转的组件中使用props.history.listen() 监听路由, 得到返回值cancle this.cancle = props.histor

```js 路由控制跳转的组件中(一般是views目录下的页面组件),props会自动添加以下三个字段, (根组件和components中的组件没有路由信息) history : 主要用于路由跳转和路

```js 提示: 此教程使用react-router 6.4 版本 + hooks 语法实现 1, 下载react的路由模块(最新6.10.0) npm install react-router-d

```js 提示: 此教程使用react-router 6.3 版本 + hooks 语法实现 1, 下载react的路由模块(默认最新6.3) npm install react-router-do

```js 提示: 此教程使用react-router 5.x 版本实现 1, 下载react的路由模块 npm install react-router-dom@5 --save 2, 在入口文件

```js 提示: 此教程使用react-router 6.3 版本实现 1, 下载react的路由模块(默认最新6.3) npm install react-router-dom --save 2,

在react组件中获取DOM元素的三种方式 1, 给标签设置ref属性, 通过this.refs调用 (老版本语法,将要废除) 2, 在构造器中创建ref全局变量, 在标签中ref属性动态绑定这个全局

在react组件中,默认所有的样式文件都是全局作用域,不存在样式隔离 方法一: 根标签选择器限制 如果需要每个组件样式隔离, 在设置组件样式时, 每一个选择器都添加组件根标签选择器, 以区分不同组件中

// 此模块适用于webpack构建的项目 1, 下载安装懒加载模块 2, 在src/assets/目录下放入懒加载占位图 placeholder.gif 3, 在需要使用懒加载的组件中导入懒加载模块

官方地址: https://www.npmjs.com/package/react-lazy-load-image-component // 适用于vite构建的react项目 1, 下载安装懒加载模

1, 下载安装代理模块 2, 在src目录中新建setupProxy.js文件，在文件中放入如下代码(注意是src目录,不是根目录)： 附加: 设置项目端口号: node_modules/react-

使用vite构建vue项目和react项目,配置代理等信息的方式是一样的 在vite.config.js中加入以下代码 (针对react,可全选替换)