當我單擊將數組的第一個元素發送到最后一個位置的按鈕時，我嘗試重新渲染列表，但是，當我單擊該按鈕時，組件不會重新渲染，即使 console.log 顯示該數組已更改： codesandboximport React, { useState } from "react";const DailySchedule = () => {  const [exerciseList, setExerciseList] = useState([    "exercise 1",    "exercise 2",    "exercise 3"  ]);  return (    <div>      <section>        <h2>Warm-up</h2>        <ul>          {exerciseList.map((exrcs, idx) => {            return (              <li>                {exrcs}{" "}                {idx === 0 && (                  <button                    onClick={() => {                      exerciseList.push(exerciseList.shift());                      setExerciseList(exerciseList);                      console.log(exerciseList);                    }}                  >                    Done                  </button>                )}              </li>            );          })}        </ul>      </section>    </div>  );};export default DailySchedule;