React-hooks
||·····
一个需要认清自己的大学生
展开
-
React-hooks-useCallback
useCallbak返回一个memoized(被记住的,备忘)的回调函数// 官网示例const memoizedCallbak = useCallback( ()=>{ doSomething(a,b); }, [a,b]) 把内联回调函数及依赖项数组作为参数传入 useCallback,它将返回该回调函数的 memoized 版本,该回调函数仅在某个依赖项改变时才会更新。当你把回调函数传递给经过优化的并使用引用相等性去避免非必要渲染原创 2021-06-07 15:02:24 · 133 阅读 · 0 评论 -
React-hooks-useReducer
useReducer这是一个额外的Hooks,在某些特殊场景可能会用到。使用方式// 使用方式const [state, dispatch] = useReducer(reducer, initialArg, init);// 官网示例function init(initialCount) { return {count: initialCount};}function reducer(state, action) { switch (action.type) {原创 2021-06-07 15:01:33 · 88 阅读 · 0 评论 -
React-hooks-useContext
React-hooks-useContext在学习之前我们先来看看我们在没有hooks之前使用Context, 使用Context是为了避免props多层传递的麻烦// ###App.jsimport React, { createContext, Component } from "react"// foo作为默认数据被传入const foo = { name: "wangzhan", age: 22}export const {Provider, Consumer} =原创 2021-06-07 15:00:38 · 101 阅读 · 0 评论 -
React-Hooks-useEffect
React-Hooks-useEffect1. Effect hook 可以让我们在函数式组件中执行副作用操作// react官网示例import React, { useState, useEffect } from 'react';function Example() { const [count, setCount] = useState(0); // Similar to componentDidMount and componentDidUpdate: useEffect(原创 2021-06-01 15:48:40 · 211 阅读 · 0 评论 -
React-Hooks-useState
1. React-Hooks-useStateHooks是什么Hooks 是让我们在React中编写function组件时,能运用一些 React x16.8之前function组件无法完成的事情。例如:React中function组件不能拥有自己的状态,无法实现生命周期等等。爲什麽使用Hooks在我們生產中,會產生非常多的高階組件嵌套,而形成嵌套地獄,如 providers,consumers,高阶组件,render props,這讓代碼非常不容易理解。爲了一些數據的傳遞我們使用高階組件為組原创 2021-05-09 14:28:17 · 92 阅读 · 0 评论