React Hooks 静态变量：对象属性与 useRef()

在 React 函数组件中声明静态变量有什么优点或缺点useRef()钩子与简单地将它们声明为对象属性。

useRef 方法：

import React, { useRef } from "react";

const MyComponent = () => {

  const staticProp = useRef("Hello, World!");

  return (
    <div>{staticProp.current}</div>
  )
}

export default MyComponent;

对象属性方法：

import React from "react";

const MyComponent = () => {

  return (
    <div>{MyComponent.staticPro}</div>
  )
}

MyComponent.staticProp = "Hello, World!";

export default MyComponent;

参考资料适用于可变值 https://reactjs.org/docs/hooks-faq.html#is-there-something-like-instance-variables绑定到您的组件实例。它们与实例变量类似。如果变量应该是静态的，则不需要 refs。您可以将其声明为组件函数的属性，或者声明为外部作用域中的常量：

const staticProp = "Hello, World!";

const MyComponent = () => {
  return (
    <div>{staticProp}</div>
  )
}