当前位置: 首页 > 面试题库 >

与对象反应挂钩useState()

汲利
2023-03-14
问题内容

在带有钩子的React中,更新状态的正确方法是嵌套对象是什么?

export Example = () => {
  const [exampleState, setExampleState] = useState(
  {masterField: {
        fieldOne: "a",
        fieldTwo: {
           fieldTwoOne: "b"
           fieldTwoTwo: "c"
           }
        }
   })

一个人怎么会使用setExampleState到的更新exampleStatea(附加一个字段)?

const a = {
masterField: {
        fieldOne: "a",
        fieldTwo: {
           fieldTwoOne: "b",
           fieldTwoTwo: "c"
           }
        },
  masterField2: {
        fieldOne: "c",
        fieldTwo: {
           fieldTwoOne: "d",
           fieldTwoTwo: "e"
           }
        },
   }
}

b (改变价值)?

const b = {masterField: {
        fieldOne: "e",
        fieldTwo: {
           fieldTwoOne: "f"
           fieldTwoTwo: "g"
           }
        }
   })

问题答案:

您可以像这样传递新值

  setExampleState({...exampleState,  masterField2: {
        fieldOne: "c",
        fieldTwo: {
           fieldTwoOne: "d",
           fieldTwoTwo: "e"
           }
        },
   }})


 类似资料:
  • 我在React hook中遇到了一些非常奇怪的行为。在下面的代码中(https://codesandbox.io/s/purple-bush-nb5uy?file=/src/index.js): 单击时,我们在控制台中获得以下序列: 我希望: 因为我认为如果React找到setter并在重新渲染后执行以下代码,它会立即重新渲染。此外,我的React应用程序也是如此: 当运行以及值与状态变量的内容不

  • 我正在尝试新的hooks功能,并坚持认为我的状态没有更新。 实际上,状态已更新(我可以在console.log中看到更新的值,并且我的组件会重新运行useEffect),但是useEffect方法使用我的旧状态,并仅将签名保存给第一个用户,而活动用户在状态中确实发生了更改。 我想过添加useCallback,并将我的方法移动到use效果或组件本身,但我可以设法让它工作。 状态: 这是我的效果: 这

  • 更新状态的正确方式是什么,是一个嵌套对象,在与钩子反应? 如何使用将更新为(附加字段)? (更改值)?

  • 我正在构建一个应用程序(使用TypeScript),我面临一个问题,该解决方案需要识别不同的子组件的可能性。基本上是这样的: 我已经搜索了一段时间,许多,如果不是所有接受的答案(像这里:只允许反应组件中特定类型的子级),都是使用()。不幸的是,也有人说在生产中可能会缩小,所以我不能依赖它。 我发现的唯一方法是“强制”一个自己的显示名称。基本上,我创建了一个接口,然后为每个应该可以识别的组件扩展它。

  • 我试图理解新的React钩子及其用例。 我的目标是一个单一的组成部分,计算起来,也每x滴答计数另一个计数器。 我使用useEffect和useState实现了它,主要有两个问题: 1。组件在调用超时之前卸载时发生内存泄漏(使用react router导航时) 2。该组件在每个刻度上渲染两次,因为useEffect和useState都会触发渲染。 我认为解决方案是使用useRef或usemo,但我还