weixin_42349568的博客

Hook 是什么？Hook 是一个特殊的函数，它可以让你“钩入” React 的特性。以前写react使用的是class无状态组件,现在使用hooks,其实就是在函数作用域中进行操作。所以又叫做函数式组件。

1. React入门 ## 1.1. React基本认识 ## 1.2. React基本使用 ## 1.3. JSX的理解和使用 ## 1.4. 模块与模块化, 组件与组件化的理解 1. React入门 1.1. React的基本认识 1). Facebook开源的一个js库 2). 一个用来动态构建用户界面的js库，不像jq那样只是包装了用户的dom操作，而实际上还是用户编辑了dom触发的视图更新。而react,它和vue一样，是数据驱动，使用者可以不再关注于dom层面上的操作。 3). React的特

一，概述 它的作用就是让函数式组件也可以使用状态管理。 二，项目创建 1，创建项目 npx create-react-app react-hooks-demo 2,编写原有的项目结构 三，使用hooks来改造-----useState 关于 useState 的用法是，需要传入一个参数作为状态的初始值，当函数执行后会返回两个值，一个是当前状态的属性，一个是修改状态的方法。 于是修改为函数式组件： import React ,{useState}from 'react'; function Exampl

前言，对应的视频教程是B站技术胖的redux视频教程，本文内容是对应20-24节。 视频地址：https://www.bilibili.com/video/BV1w441137ss?p=21 项目代码地址：https://gitee.com/ling-xu/react-rudex-demo 一，新建项目 1，创建新项目 npx create-react-app react-redux-demo 2，删除src下并不必要的文件（只保留index.js） 并修改index.js： import React

一，项目地址 https://gitee.com/ling-xu/react-redux-demo/tree/redux-saga%E7%9A%84%E5%9F%BA%E6%9C%AC%E4%BD%BF%E7%94%A8/ 二，saga的概述 1，它和redux-chunk差不多，都是redux的中间件。 2，官网地址：[https://www.npmjs.com/package/redux-saga](https://www.npmjs.com/package/redux-saga) 3，安装 npm i

一，原有的基础项目 https://blog.csdn.net/weixin_42349568/article/details/117196231 二，redux-chunk解决的问题 1，中间件的产生原因 https://blog.csdn.net/qdmoment/article/details/84024611 这篇博客讲得很清楚了。 中间件根本原理：对store.dispatch进行改造。 中间件出现的原因：由于很多时候执行dispatch并不仅仅是立即去更新reducer,这时需要执行其他函数来

一，redux解决了什么问题 ​ 在没有redux的时候，react的各个组件间的数据传递如左图所示，只能挨个进行，如果紫色组件需要修改其他组件的状态值，就需要一个个组件传递数据状态的变化。 ​ 而引入redux之后，就相当于在全局区域创建了一个专门用来管理状态值的仓库，通过紫色组件修改这个仓库对应的值，就可以完成依赖于这个值的其他组件的状态更新。（单向数据流，子修改store,依赖于store的会自动更新修改） 二，redux的工作流程 在react的组件中，不再使用自身的状态，而是通过action从

一，实现效果 二，实现过程 1，这篇文章的前四步： https://blog.csdn.net/weixin_42349568/article/details/116567355 2，引入react-router-dom npm install --save react-router-dom 3,使用路由 import React from 'react' import ReactDOM from 'react-dom' import { HashRouter, Switch, Route } from

一，初始项目搭建 npx create-react-app my-app cd my-app npm start 二，项目的目录结构设计 1，新建项目后把src下的东西全删除 2，然后创建相关的目录结构： 三，初始化配置移动端项目文件 1，引入antd-mobile 官网：https://mobile.ant.design/docs/react/introduce-cn 安装： npm install antd-mobile --save 2,index.html配置移动端参数 <meta n

一，基本的组件创建方式，state,props,jsx语法 import React from 'react' import { Button } from 'antd-mobile' //函数式组件 function Welcome(props){ return <h1>Hello, {props.name}</h1>; } //类组件 class Welcome2 extends React.Component { render() { return <h1&gt