小编Reu*_*dhu的帖子

我有一个 Ul 组件，其中包含一组具有不同值的对象。此列表中名为 TestCase 的每个项目都有一个按钮，用于进行重新调用并更新其对象。然而，并不是所有的 TestItem 都需要更新。只有那些按钮被点击的人。此数组的状态存储在名为 TestCaseContainer 的父容器组件中。但是，我的按钮将根据数组中受影响的 TestItem 相应地更新状态。这会导致整个列表重新呈现。如何只呈现更改的 TestItems，而不是每次更新元素时​​都呈现整个 ul。我读过使用 useMemo 以便组件可以记住传递的道具，但是我不知道如何正确实现它。

我怎样才能停止所有的重新渲染！！为乱码提前道歉！

这是我的代码

Regression.js - 保存所有状态

const Testing = forwardRef((props,ref) => {


  const templateTestItem = {id:0,formData:{date:'',env:'',assetClass:'',metric:'',nodeLevel:'',nodeName:'',testName:'',dataType:'',tradeId:''},results:[],isLoading:false}
  const testCaseRef = useRef()
  const [isRun, setIsRun] = useState(false)
  const [testItems, setTestItems] = useState([ templateTestItem])
  const [stats,setStats] = useState(null)


  const addTestItem = () => {

    const newIndex = testItems.length 
    // console.log(newIndex)

    const templateTestItem = {id:newIndex,formData:{date:'',env:'',assetClass:'',metric:'',nodeLevel:'',nodeName:'',testName:'',dataType:'',tradeId:''},results:[],isLoading:false}
    setTestItems([...testItems, templateTestItem])

  }

  const addUploadCases = (cases) => {

    setTestItems([])
    const UploadedItems = cases.map((item,index)=>{

        return{ …