在状态变化时反应动画

Question

在状态更改时，元素根据当前数组切换位置。我想添加一个动画来显示交换发生的过渡，是否有一种简单的方法可以做到这一点。

   const bubbleSort = async () => {
      let arr = test;
      for(let i=0;i<arr.length;i++){
        for(let j=0;j<arr.length-1-i;j++){
          setActiveIndex([j,j+1]);

           if(arr[j]>arr[j+1]){
              let temp = arr[j];
              arr[j] = arr[j+1];
              arr[j+1] = temp;

           }
           await sleep(1000);

           setTest([...arr]);
        }
        setSortedIndex(test.length-1-i);
      }

Answer 1

setState（）有一个可选参数，它是一个回调函数，它在状态更改时执行，您可以在其中执行所需的操作。

this.setState({
     currentMonth: +this.state.currentMonth + 1
    }, () => {
     //This is the call back function, perform the desired actions here.
    })
}