useRef

在 React 组件中获取/操作DOM,需要使用 useRef 钩子函数。

实现步骤

使用 useRef 创建 ref 对象,并与 JSX 绑定
在 DOM 可用时,通过 inputRef.current 拿到 DOM 对象
- 这里的可用是指：组件渲染完毕之后,就是DOM生成之后才可用

1import { useRef } from "react";
2export default function App() {
3  const inputRef = useRef(null);
4  const GetDomElement = () => {
5    console.log(inputRef.current);
6  };
7  return (
8    <>
9      <input type="text" ref={inputRef} />
10      <button onClick={GetDomElement}>获取DOM元素</button>
11    </>
12  );
13}

useRef#

useRef