Javascript 路由后保留数组状态钩子

在路由到另一个页面后，我试图保留/保留react

useState

hook，现在假设我有一个名为

sections

的数组，它保存在

useState

hook中，在数组中我有3项

广告,， 促进,， 建造

当我路由到另一个渲染时，

useState

hook的值被重置，其中包括数组

相关功能

const [calculator, setCalculator] = useState({section: [], graphic: false}); //Sections array inside

   // Responsible to add item to the array, also promote and ads, just short version so you can understand
   function addPath(section){
        if(section === "build"){
            if(calculator.section.some(val => val === "build")){
                let filteredArray = calculator.section.filter(item => item !== 'build')
                setCalculator({section: filteredArray});
                $('.build').removeClass('active');
            }
            else{
                var joined = calculator.section.concat('build');
                setCalculator({ section: joined })
                $('.build').addClass('active');
            }
        }
    }

//Route from /start to /values
const Continue = () =>{
    history.push("/values");
    history.go(0);
}

// Check if the item exist in the array after routing the page
function checkArray(val) {
    return calculator.section.some(item => item === val);
}

JSX

 <Route path="/start">
     <p className="secondary">
        בחר מסלול רלוונטי (ניתן לבחור יותר מאחד)
     </p>
     <Row className="margTop">
           <Col lg="4"><img id="firstSelectors" className="build" onClick={() => addPath('build')} src={Code} alt="בניית אתרים" /></Col>
           <Col lg="4"><img id="firstSelectors" className="promote" onClick={() => addPath('promote')}  src={Promotion} alt="קידום אתרים" /></Col>
           <Col lg="4"><img id="firstSelectors" className="ad" onClick={() => addPath('ad')}  src={Advertise} alt="שיווק דיגטלי" /></Col>
       </Row>
       <button onClick={Continue}>המשך</button>
  </Route>
  <Route path="/values">
        {checkArray('ad') ? 'yes' : 'no'}
  </Route>

בחר מסלול רלוונטי (ניתן לבחור יותר מאחד)

המשך
{checkArray（'ad'）？'yes'：'no'}

---

在路由到另一个页面后，如何保留

useState

hook？现在它正在重置（我已经调试了计算器值以检查它）。

对于您的用例，我将创建一个新的钩子，在挂载时从localStorage读取并将更改持久化到localStorage

useHooks的钩子很适合这里