七天接手react项目 —— state事件处理ref (4)

Refs 是使用 React.createRef() 创建的，并通过 ref 属性附加到 React 元素。在构造组件时，通常将 Refs 分配给实例属性，以便可以在整个组件中引用它们 —— 官网-创建 Refs

如果需要在增加一个 ref，则需要再次调用 React.createRef()。

在函数组件中使用 ref

你不能在函数组件上使用 ref 属性，因为他们没有实例 —— 官网-访问 Refs

而通过 useRef Hook 能让我们在函数组件使用 ref。重写 class 组件 EventDemo1：

function EventDemo1() { const button = React.useRef(null) function handleClick() { console.log(button.current.innerHTML) } return ( <button ref={button} onClick={() => handleClick()}> click </button> ) }

每点击一下 button，控制台将输出一次 click。

const refContainer = useRef(initialValue);

useRef 返回一个可变的 ref 对象，其 .current 属性被初始化为传入的参数（initialValue） —— 官网-