加载中
react hook useCallback

参考 https://juejin.im/post/5ec2465a5188256d841a552a 父组件传入数据和回调 两个Board组件分别显示信息 age组件接收修改age的回调, 并执行 score组件接收修改score的回调, 并执行 点击age...

07/22 21:37
52
react hook 总结

React.StrictMode 一个很蛋疼的事情是在dev环境下, react 会自动在组件最外面包裹一个 React.StrictMode, 用于将组件渲染两次, 主要原因为react团队认为在react组件渲染时不应该有任何副作用...

08/01 23:36
106
react hook useEffect

useEffect 在重新渲染之后执行 数据变化会触发重新渲染 import React, { useState, useEffect } from "react"; export default () => { const [str, setStr] = useState("init"); useEffect...

07/21 22:37
222
react hook useState

简单计数器 set函数不会合并, 在使用对象和数组的时候需要手动解构 对于修改数据比较简单的情况, 推荐使用函数进行修改, 会传入先前值, 将返回值作为最新值 import React, { useState } fro...

07/21 20:57
21
react hook useReducer

使用useReducer 封装计数器的维护逻辑 import React, { useState, useEffect, useReducer } from "react"; const initialState = 0; const reducer = (state, action) => { switch (action)...

07/22 22:16
103
react hook useLayoutEffect

useEffect 在组件挂载, dom渲染完毕之后调用 useLayoutEffect 在组件挂载,dom 处理完毕, dom渲染之前, 同步执行, 如果其中有大量计算 ,会阻塞渲染过程, 造成白屏 主要用于第一次渲染后修改d...

07/23 23:13
120
react hook useRef

可以暂停的定时器, 使用ref保存 定时器的handler import React, { useState, useEffect, useRef } from "react"; export default () => { const [count, setCount] = useState(0); const ref...

07/22 00:02
168
react 异常捕获

参考 https://zhuanlan.zhihu.com/p/259571403 这些人的脑洞可真大... 用户的执行函数 const f = () => JSON.parse(); const test = () => { console.log("test 1"); f(); ......

10/02 18:22
56
react hook useMemo

类似vue的computed 只有在a变化后,才重新计算c, 用于过滤不必要的计算 useMemo在渲染期间执行, 此时不要进行dom处理 import React, { useState, useEffect, useMemo } from "react"; const d...

07/22 21:08
37
react hook useContext

在不影响中间组件的情况下, 从根组件向最底层组件传值 根组件使用Provide提供值, 子组件使用useContext获取提供的值 import React, { useState, useContext, useEffect } from "react"; cons...

07/22 21:53
76
react 消除知乎div

https://mp.weixin.qq.com/s/ICjOlJL-fUGRb2S_xqBT7Q 思路就是根据react注入的变量, 逐步拿到react实例, 然后替换 createElement 方法 先通过dev变量 __REACT_DEVTOOLS_GLOBAL_HOOK__拿到 re...

10/31 23:58
12
react 高阶组件 HOC

官方文档讲的相当透彻 https://react.docschina.org/docs/higher-order-components.html 这个文章也写的很好很详细 https://juejin.im/post/6844904050236850184 高阶组件是参数为组件,返回...

09/13 22:08
30
react 实现自定义的hook

使用hook封装count计数器 import React, { useState, useEffect } from "react"; const useCount = (init = 0, dx = 1) => { const [count, setCount] = useState(init); const dec = () =>...

07/22 22:42
115
react todos 简单实现

可以添加信息,并且按钮处有下个信息的编号 分3个组件,标题组件,添加组件,列表组件 安装脚手架 cnpm i create-react-app -g 设置仓库 npm config set registry https://registry.npm.tao...

2019/04/11 20:26
0
react hook 依赖数组

UI = component(props) 函数式组件什么时候被渲染, props被修改, 调用setState 下面修改ref不会被渲染 import React, { useRef, useEffect, useState } from "react"; export default () =>...

11/05 21:45
40
react css 模块引入

style 行内设置。传递一个对象 <div style={{height: '50px', width: '50px',backgroundColor:'red'}}></div> 引入css时,默认全局有效 设置局部有效,执行命令,会在项目中增加webpack配置项...

2019/04/12 15:15
0
react input 双向绑定

设置input的value,并绑定onChange事件,通过setState修改属性,完成视图更新 可以使用事件或者ref的方式获得输入框的新值 import React, {Component} from 'react'; class App extends Comp...

2019/04/12 16:10
0
mobx-react 类似vuex的react版 响应式状态管理

风格上和react的不可变数据有些不太一样, 但是使用上确实和vuex很像 安装 https://github.com/mobxjs/mobx-react yarn add mobx mobx-react 简单计数器 import React from 'react'; import ...

react hook 小球拖拽

可能也就是这个会比vue好点 vue 也可以... 虽然能用相同的思维实现, 但是确实手感不如vue 使用vue实现不管怎么拖都没问题, 但是react的有时候会出现事件来不及解除, 导致一直跟着鼠标 import...

07/24 21:46
156
react hook 依赖诚实和依赖欺骗

参考 http://www.ptbird.cn/react-hook-usereducer-usecallback.html http://www.ptbird.cn/react-hook-useEffect-useReducer.html 依赖欺骗导致count的更新并没有按照预期以step的步长递增的...

08/29 15:21
143

没有更多内容

加载失败,请刷新页面

返回顶部
顶部