因为这几天和一个大佬准备开始整一个前端开源项目了，所以准备写点react的东西。react的一个特点是函数式编程。顾名思义就是命令式编程。它有三大特性，以下为摘抄像Clojure一样，默认上变量是不可变的，如果你要改变变量，你需要把变量copy出去修改。这样一来，可以让你的程序少很多Bug。因为，程序中的状态不好维护，在并发的时候更不好维护。(你可以试想一下如果你的程序有个复杂的状态，当以后别人改
对于react，浏览器进来后，首先会寻找public文件夹里面的index.html，在该html中有id为root的div，<
原创
2022-06-20 20:01:43
264阅读
hook是什么？函数式组件+hookHook 是一些可以让你在函数组件里“钩入” React state 及生命周期等特性的函数。Hook 不能在 class 组件中使用 —— 这使得你不使用 class 也能使用 React。React 内置了一些像 useState 这样的 Hook。你也可以创建你自己的 Hook 来复用不同组件之间的状态逻辑。一，State Hook先看
转载
2024-06-22 17:21:58
318阅读
之前我们已经掌握了useState的使用，在 class 中，我们通过在构造函数中设置 this.state 为 { count: 0 } 来初始化 count state 为 0：class Example extends React.Component {
constructor(props) {
super(props);
this.state = {
cou
转载
2024-06-26 10:46:36
78阅读
以下文字来自于掘金，已征得作者 hexh授权。前言一周的砖又快搬完了，又到了开心快乐的总结时间~这两周一直在 hook 函数的“坑”里，久久不能自拔。应该也不能叫做“坑”吧，还是自己太菜了，看文档不仔细，很多以为不重要，但在实际应用中却很关键的点总是被自己忽略。所以我准备多花点时间，把官网的一些 hook 函数，再回过头看一遍，整理整理(在整理的过程，我觉得更容易发现问题和总结经验)。这篇文章主要
setState(arg1,arg2) 括号内的arg1可传入两种参数，一种是对象，一种是函数. arg2为更改state之后的回调方法,arg2可为空.对象式的setState用法例如：//第一种
this.setState({ isAuthenticated: true});
this.setState({ isAuthenticated: true},()=>{});
this.se
转载
2024-10-16 20:12:34
19阅读
一、组件生命周期的执行次数是什么样子的？？？只执行一次： constructor、componentWillMount、componentDidMount
执行多次：render 、子组件的componentWillReceiveProps、componentWillUpdate、componentDidUpdate
有条件的执行：componentWillUnmount（页面离开，组件销毁时
初衷发现网上很少有用 TypeScript 写的 React hooks 教程，大部分是 JavaScript 写的，还是老旧的类组件的写法，函数组件都推出多少年了，建议新手直接上 hooks 函数写法，另外很多教程解释的也不太清楚，看起来云里雾里，官方文档也一样对于从其他端（移动端、后端）转到前端的开发者，一开始可能比较难理解 React 的编程思想（不要问我怎么知道的）于是写了这些面向非前端开
前言 react生命周期在各个阶段的执行顺序是有所差异的，接下来我们将详细解析react在各个阶段生命周期的执行顺序，以及各个生命周期在组件中充当的作用（以下生命周期指的是react16之后的版本）组件挂载时当组件实例被创建并插入DOM时，其生命周期调用顺序如下：constructor()static g
转载
2024-09-23 18:58:23
64阅读
一.使用href:const w=window.open('about:blank');
w.location.href='/#/exam?id='+value.examsId 在新的页面上可直接在location里接收 Js的几种调用方法（参考总结的）1、a href="javascript:js_method();" &nbs
转载
2024-02-28 10:35:28
46阅读
通过这个教程，我想告诉你在 React 中如何使用 state 和 effect 这两种 hooks 去请求数据。我们将使用众所周知的 Hacker News API 来获取一些热门文章。你将定义属于你自己的数据请求的 Hooks ，并且可以在你所有的应用中复用，也可以发布到 npm 。如果你不了解 React 的这些新特性，可以查看我的另一篇文章 introduction to React Ho
转载
2024-04-24 13:26:37
79阅读
React16.8+版本的发布，hooks函数是新增的一大功能，其实useState函数是让函数组件有了状态，那么我们就来详细了解一下useState这个函数。用法：const [state, setState] = useState(initialState);因为react是函数式编程，所以上面的代码就很好理解了，useState函数接收一个初始化参数initialState,其返回值用数组解
转载
2024-05-02 23:23:21
155阅读
React 组件生命周期从事前端工作已经有一段时间，最近在面试求职者的时候发现，React最基础的实例生命周期都说不清楚，也不能说清楚每个生命周期方法具体作用，所以我通过代码+官网文档的形式总结下文。React生命周期可以说是react最基础的知识点，熟练掌握也可以更好的使用和优化react项目。React 生命周期图谱React 生命周期函数详细介绍1.组件挂载过程constructorcomp
react项目中接口未能执行从dva.js上面找问题
原创
2022-07-31 00:02:32
56阅读
React原理揭秘目标能够说出React组件的更新机制能够对组件进行性能优化能够说出虚拟DOM和DIff算法组件更新机制setState() 的两个作用修改state更新组件过程：父组件重新渲染时，也会重新渲染子组件，但只会渲染当前组件子树（当前组件以其所有子组件）组件性能优化减轻state减轻state：只存储跟组件渲染相关的数据（比如：count/ 列表数据 /loading等）注意：不用做渲
一、react原理的初步了解：1）setState()的说明2）JSX语法转化3）组件更新机制4）组件性能优化5）虚拟DOM和diff算法 1、setState()的说明作用：修改state，更新UI1）setState()异步更新数据this.state = {
a: 0
}
this.setState({
a: this.state.a + 1
})
console.lo
一、是什么 一个组件的显示形态可以由数据状态和外部参数所决定，而数据状态就是state 当需要修改里面的值的状态需要通过调用setState来改变，从而达到更新组件内部数据的作用 如下例子： import React, { Component } from 'react' export defaul ...
转载
2021-07-23 10:09:00
321阅读
2评论
前言上个月发表了一篇 React源码学习——ReactClass，但是后来我发现，大家对这种大量贴代码分析源码的形式并不感冒。讲道理，我自己看着也烦，还不如自己直接去翻源码来得痛快。吸取了上一次的教训，这次我决定：理性贴代码！翻阅源代码的工作还是留给各位小伙伴自己去做比较好。本来这次想准备说一说我们平时一直提到的React Virture DOM，但这可能又会造成无限贴源码的后果，因为v
作者 : 墨成 React 版本 :16.4.1 仔细阅读官网setState的描述会发现里面透露的信息量巨大，我也建议初学者在学习 React之前仔细阅读原始文档，以下是我个人在阅读文档时的一些领悟，配合了一些翻译和讲解，限于个人水平，不足之处，各位请多多指出 setState(updater[, callback])复制代码setState() enqueues changes to the
react
原创
2023-02-10 09:57:18
59阅读
