参考

• React 官方文档
• demo

怎样“记住”信息，而不触发重新渲染？

• 可以使用 ref，它会记住信息，ref 的变更也不会触发新的渲染。
• ref 和 state 的区别

  ref	state
  useRef	useState
  修改时不触发渲染	修改时触发渲染
  可变，可以在渲染过程之外修改 current 的值	“不可变”，你必须使用 state setter 函数修改 state，从而排队重新渲染
  不应在渲染期间读取、写入 current	可以随时读取 state，但每次渲染都有自己不变的 state 快照

• 何时使用 useRef？
  • 当组件需要跳出 React 与外部 API 交互时就会用到 ref，如：存储 timeout ID
  • 存储和操作 DOM 元素
  • 存储不需要被用来计算 JSX 的其他对象
• ref 的最佳实践
  • 将 ref 视为脱围机制：当使用外部系统或浏览器 API 时，如果应用程序逻辑和数据流很大一部分依赖于 ref，你可能需要重新考虑你的设计。
  • 不要在渲染过程中读取或写入 ref.current：通常渲染过程中需要某些信息，应该使用 state，而不是 ref。