React
当白
大人不华,君子务实
展开
-
【react】createElement实例
import React ,{createElement } from 'react';import './App.css';function App() { var child1 = React.createElement('a', null, 'two'); return ( <div className="App"> { createElement( //第一个参数是创建一个react元素 (prop原创 2022-04-14 10:18:31 · 688 阅读 · 0 评论 -
【react】antd DatePicker禁止当天前后时间
Pre:用到了moment,先添加 <DatePicker disabledDate={disabledDate} format="YYYY-MM-DD" /> 禁止当天之前的时间://主要是拿current去做比较,得到一个时间段const disabledDate = (current)=> { //当天之前的不可选,不包括当天 return current && current < moment().subtract(1,"days"原创 2022-04-12 09:17:00 · 2154 阅读 · 0 评论 -
【react】react和vue的最大区别
一直都是两者都在用,现在基于自己的一些使用体验,说一下两者的本质区别首先我们看vue:vue最核心的部分就是它的双向绑定,defineProperty和后来的Proxy让getter搜集依赖,setter触发更新等于是视图的更新,都交予了框架自己去完成然后我们在看react:react将setter外置,等于触发更新的时机可以coder自己决定而且如果想用双向绑定也可以像vue一样实现一个类似的reactive像ahooks里的useReactive这样选择就变得就更多样,然后在原创 2022-04-08 09:07:33 · 1029 阅读 · 2 评论 -
【react】useEffect和async/await
如果要在useEffect中使用异步函数,大致有两种方法使用自执行函数在useEffect内外创建异步函数,然后调用(1)自执行函数 useEffect(() => { (async function myFunc() { await loadContent(); })(); }, []);(2)创建异步函数变量,执行可以写在useEffect里,也可以写在外边调个人比较喜欢直接在里边包一层useEffect(() => { const原创 2022-04-08 08:58:41 · 1776 阅读 · 0 评论 -
【react】yarn run eject
eject命令可以将webpack的配置从黑盒变成白盒,将webpack等配置信息从react-scripts中暴露出来,可以自己配置微博pack的loader和出入口以及插件等内容;eg:关闭严格模式 在config/webpack.config.js中关闭eslint的loader/* { test: /\.(js|mjs|jsx|ts|tsx)$/, enforce: 'pre', use: [ { options: { formatter:原创 2021-09-17 10:48:53 · 311 阅读 · 0 评论 -
【react】fiber简明教程
1.requestIdleCallbackrequestIdleCallback(workLoop);这是浏览器给出的一个新APIrequestIdleCallback接收一个回调,这个回调会在浏览器空闲时调用,每次调用会传入一个 deadline,可以拿到当前还空余多久可以左自己的事情然后我们就可以在这个空余时间去遍历自己的fiber tree2.fiber tree整体是个链表我们假设有这样一个元素树链表生成的过程是:root的child设置为div然后在div的找它的child(原创 2021-01-31 14:39:43 · 303 阅读 · 0 评论 -
【react】useMemo和useEffect的相同点和不同点
1.相同点两者在写法上有很大的相同之处useMemo第一个参数需要返回一个函数,useEffect也可以返回一个函数两者第二参数都可以放一个数组,里边的元素有着浅比较触发函数的作用不同点useMemo是dom更新前触发的,useuseEffect是dom更新后触发的useMemo主要能和useCallback联合使用,利用其浅比较的能力和useCallback缓存函数的作用一起封装函数,见另一篇文章useEffect主要用来模拟生命周期post【react】useCallback原创 2021-01-25 21:43:41 · 1800 阅读 · 0 评论 -
【react】useCallback和useMemo的真正区别和配合使用实例
今天认真看了useCallback和useMemo并且在网上找了很多相关资料,发现传抄严重而且理解的真不咋地so有问题自己写一下~pre:引入import {useCallback,useMemo} from 'react';1.子组件里测试useMemofunction Example6(props){ //当props.count发生改变的时候,会触发事件, //自动触发,不需调用 useMemo(() => doSomething(props.count), [pr原创 2021-01-25 17:49:09 · 1228 阅读 · 0 评论