React.useState 的 ref 引用方法

今天发现了一个,在 无状态函数式组件 中很精妙的 ref 引用方法 其中用到了 React.useState

const useState = React.useState

// 结合 useState 的用法
const Name1 = () => {
	const [refName, setRefName] = useState(null);
	const click1 = str => {
		console.log(refName)
	}
	return (
		<>
			<div ref={setRefName}>
				目标节点
			</div>
			<div onClick={click1}>click1</div>
		</>
	);
};
const Name2 = () => {
	let refName;
	const click1 = str => {
		console.log(refName)
	}
	return (
		<>
			<div ref={i => refName = i}>
				目标节点
			</div>
			<div onClick={click1}>click1</div>
		</>
	);
};

我的理解: setRefName(value) 是修改 refName 的方法, 作用就是 refName = value 在 ref 中使用, 相当于 setRefName(this), 也就是 refName = this

注:useState 的一般用

const [swq, setSwq] = useState('初始值');
console.log(swq)	// 调用
setSwq("new swq")	// 赋新值

// 赋值要在下一个周期才生效

end