时间戳

首页 > 解决方案 > 使用.set时如何使react hookstate.js停止重新渲染？

reactjs - 使用.set时如何使react hookstate.js停止重新渲染？

问题描述

我已经在 hookstate 中设置了一个状态对象。在一个特定的文件中，我有以下调用它：

const druidPowers = useDruidPowersState(druidPowersState)

  useEffect(() => {
   Axios.get('http://localhost:5000/powers/druidpowers/levelone')
    .then((data) => {
        const powersData = data.data.druidpowers[0].powers.levelOne
        druidPowers.shapeshift.set(powersData.shapeshift)
        druidPowers.naturesBoon.set(powersData.naturesBoon)
    })
  }, [druidPowers.shapeshift, druidPowers.naturesBoon])

  druidPowers.shapeshift.powerUsage.set({
      powerUse: {
        hp: (characterHp, body, spirit) => {
          characterHp += (body + spirit)
        }
      }
    })
  
  console.log(druidPowers, 'druid powers')

useEffect 中的代码完全符合我的意图。当我在 useEffect 之外添加 .set() 时，问题就出现了。控制台确认这是为我更新它。但是，它也确认它不会停止 console.log()'ing 它。我只是偶然地尝试在其中放置一个 , [] ，就像在 useEffect 上一样，但这并没有阻止它，所以只是想知道是否有人知道它为什么一直这样做。

标签： reactjsstate

解决方案

Hookstate 的作者在这里。每次重新渲染时都会刷新状态实例，因此每次重新渲染都会触发您的效果。替换[druidPowers.shapeshift, druidPowers.naturesBoon]为[]并停止运行效果。可以抑制此行的 ES Lint 投诉。

另外，请查看相关票证：https ://github.com/avkonst/hookstate/issues/140

推荐阅读