![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
react
文章平均质量分 52
大大大大雪哥
一个爱学习的柯基
展开
-
浅谈react hook ( 自定义hook)
importReact,{useState}from"react";importReactDOMfrom"react-dom";import"./index.css";//自定义hookconstuseAdd=(val,num)=>{let[count,setCount]=useState(val)constadd=()=>{setCount(count+num)}...原创 2021-06-26 18:17:52 · 182 阅读 · 2 评论 -
浅谈react hook ( useImperativeHandle)
importReact,{forwardRef,useRef,useImperativeHandle,useState}from"react";importReactDOMfrom"react-dom";import"./index.css";//useImperativeHandle可以让你在使用ref时自定义暴露给父组件的实例值。在大多数情况下,应当避免使用ref这样的命令式代码。useImperativeHandle应当与forward...原创 2021-06-20 12:20:00 · 398 阅读 · 0 评论 -
浅谈react hook (forwardRef)
importReact,{forwardRef,useRef}from"react";importReactDOMfrom"react-dom";import"./index.css";//forwardRef获取子组件的DomconstForward=forwardRef((props,ref)=>{return(<div><divref={ref}>富婆的快乐你不...原创 2021-06-20 12:19:34 · 1218 阅读 · 0 评论 -
浅谈react hook (useMemo())
importReact,{useMemo,useState}from"react";importReactDOMfrom"react-dom";import"./index.css";// useMemo()的出现,避免渲染过程中重复渲染类似shouldComponentUpdate//一个组件重新重新渲染,一般三种情况://要么是组件自己的状态改变//要么是父组件重新渲染,导致子组件重新渲染,但是父组件的props没有改变//要么是父组...原创 2021-06-20 12:19:07 · 173 阅读 · 0 评论 -
浅谈react hook (useContext())
importReact,{createContext,useContext}from"react";importReactDOMfrom"react-dom";import"./index.css";// useContext()的出现,方便了我们在组件之间的状态共享。//不需要多层porps传参//第一步创建createContextconstAppContext=createContext()//组件使用useContext...原创 2021-06-20 12:18:37 · 104 阅读 · 0 评论 -
浅谈react hook ( ref)
importReact,{useRef,useState,PureComponent}from"react";importReactDOMfrom"react-dom";import"./index.css";//使用ref子组件必须是类组件----------------useRef//useRef在使用的时候,可以传入默认值来指定默认值,//需要使用的时候,访问ref.current即可访问到组件实例:classChildrenextends...原创 2021-06-20 12:18:00 · 680 阅读 · 0 评论 -
浅谈react hook (useEffect )
importReact,{useState,useEffect}from"react";importReactDOMfrom"react-dom";import"./index.css";//useEffect//1,componentDidMountcomponeDidUpdatacomponetWillUnmount//2.副作用(Dom操作数据请求组件更新)//3.useEffect在组件内使用可以获取props和stats采用...原创 2021-06-20 12:17:17 · 123 阅读 · 0 评论 -
浅谈react hook (useState hook)
importReact,{useState}from"react";importReactDOMfrom"react-dom";import"./index.css";//useStatehookfunctionApp(){const[count,set]=useState(0)const[obj,setObj]=useState({name:'翠花'})const[arr,setArr]=useS...原创 2021-06-20 12:16:48 · 89 阅读 · 0 评论 -
浅谈react hook (父子传参)
importReactfrom"react";importReactDOMfrom"react-dom";import"./index.css";//1.父子间传参classSonextendsReact.Component{constructor(props){super(props);this.state={}}componentDidMount(){...原创 2021-06-20 12:16:09 · 676 阅读 · 2 评论 -
浅谈react hook (方法的使用)
importReactfrom"react";importReactDOMfrom"react-dom";import"./index.css";//1.React组件的发展//一,函数组件功能组件也叫无状态组件,一般只负责渲染结构functionWelcome(props){return<h1>你好呀,{props.name}</h1>;}//二,类组件也是有状态组件,也可以叫容器组件。一般有交互逻辑和业务逻辑。...原创 2021-06-20 12:15:31 · 138 阅读 · 0 评论 -
浅谈react hook (组件)
importReactfrom"react";importReactDOMfrom"react-dom";import"./index.css";//1.React组件的发展//一,函数组件功能组件也叫无状态组件,一般只负责渲染结构functionWelcome(props){return<h1>你好呀,{props.name}</h1>;}//二,类组件也是有状态组件,也可以叫容器组件。一般有交互逻辑和业务逻辑。...原创 2021-06-20 12:14:44 · 175 阅读 · 0 评论