我对下面的行为感到困惑。当我点击“点击我”时，test正确更新，但testSet没有更新。准确地说，测试集只更新一次，testSet的长度永远不会超过5。
useTest.ts

import { useState } from "react";
export const useTest = () => {
  const [test, setTest] = useState(["orange", "apple", "banana"]);
  const testSet = new Set(test);
  console.log(test)
  console.log(testSet)
  const increment = () => {
    test.push("grape");
    setTest([...test]);
    // setTest(newTest);
  };
  return { test, testSet, increment}
}

字符串

的数据
整个代码在下面。
App.tsx

import React from 'react';
import { Test } from './Test';
// import { Test2 } from './Test2';
function App() {
  return (
    <>
      <Test />
      {/* <Test2 /> */}
    </>
  );
}
export default App;

型
Test.tsx

import { useTest } from "./hooks/useTest";
export const Test = () => {
  const {test, testSet, increment} = useTest();
  return (
    <div>
      <h1>Test1</h1>
      <h2>{test}</h2>
      <h2>{testSet}</h2>
      <button onClick={() => {increment()}}>Click me</button>
    </div>
  );
}

型