为什么我收到此错误：React Hook useEffect 内部的变量在每次渲染后都会丢失？

Question

我收到此错误警告分配给 React Hook useEffect 内部的“高度”变量将在每次渲染后丢失。 要随着时间的推移保留该值，请将其存储在 useRef Hook 中并将可变值保留在“.current”属性中。 否则，您可以直接在 useEffect react-hooks/exhaustive-deps 中移动此变量

这是我的代码

发生什么事？

const MyComponent = ({
  height,})=>{

 useEffect(() => {
    const getData = async () => {
      try {
        if (height < 10) {
          height = 10
        }
     const newValue = calculateValue(height, width)
    }
    if(isNotValidate){
       getData()
    }
}

由于我正在使用 useEffect 的错误，但出现以下错误

Answer 1

在 React 中，state 和 props 被认为是不可变的。 当您设置height = 10时，这会改变道具 object。 错误是说每个渲染height道具都重置为传递的值。

如果当前值小于10，我只想设置新值，然后calculateValue

您可以使用最大height或值 10。

const newValue = calculateValue(Math.max(height, 10), width)