javascript - React Hooks 静态变量 : Object Property vs useRef()

标签 javascript reactjs static react-hooks

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

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;

最佳答案

Refs 对 mutable values 很有用绑定(bind)到您的组件实例。它们类似于实例变量。如果变量应该是静态的,则不需要引用。您可以将其声明为组件函数的一个属性,或作为外部作用域中的常量:

const staticProp = "Hello, World!";

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

关于javascript - React Hooks 静态变量 : Object Property vs useRef(),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58176036/

相关文章:

javascript - 单个 if 条件的行为(省略 else 返回 false)

java - Java 中静态变量和方法的概念

c++ - 未从编译静态库 C++(Linux 内核)中获取 .a 文件

使用缩放 css 属性时,Javascript slider 会更改行为

javascript - 使用 websockets 接收消息时如何更改 componentDidMount() 内的状态?

reactjs - 当用户选择一个选项但随后将其更改为另一个选项时,React 崩溃而不显示错误

java - 如何避免将此方法和所有其他变量设为静态?

javascript - Angular 禁用按钮和垫输入错误消息

javascript - 如何从 JavaScript 更改密码字段的文本?

javascript - 下拉菜单中 jQuery 的 onChange 函数不起作用