React-useRef，自定义Hook，路由

一.useRef获取dom引用

1.导入方法

//导入方法
import { useRef } from 'react'

2.使用方法（小案例）

//导入useRef
import { useRef } from 'react'
function App(){
    const pref = useRef();
    const iref = useRef();
    return(
        <div>
            //绑定pref
            <p ref={pref}>你好我是Ikun</p>
            //pref.current 代表着p标签本身
            <button onClick={ () => alert(pref.current.innerText) }>点击显示p标签内容</button>
            //绑定iref
            <input ref={iref} />
            //iref.current 代表着input框本身
            <button onClick= { () => alert(iref.current.value) }>点击显示表单内容</button>
        </div>
    )
}

3.小案例效果

二、自定义Hook

1.概念

Hook是React16.8的新增特性，它可以让你不用学class的情况下使用state以及其他的React特性

2.自定义Hook-获取窗口的宽度

2.1思路

首先初始化定义size值含有w和h；挂载完毕获取窗口的宽高和监听窗口的事件resize 卸载时候移除监听

2.2案例过程直接奉上

2.2.1首先创建hook文件夹添加文件useWin