Question

我需要在按钮上单击两次以更新状态。我有两个按钮。当我在按钮之间切换时，文本应该更改。

我发现了一些与此相关的问题，但对我没有帮助。

请找到以下代码。

import React,{useState} from "react";
import { BrowserRouter as Router, NavLink } from "react-router-dom";
import './SectionConnect.css';

const SectionConnect = () => {

const [activeButton, setActiveButton] = useState("company");

function toggleButton() {
  setActiveButton(activeButton==="company" ? "individual" : "company");

}



  return (
    <div className="connect-container">
      <div className="connect-wrapper">
        <h2>How it works</h2>
        
    {activeButton==="company"?<p>
          We help your employees maximise potential through a bespoke, science-backed wellbeing platform. 
        </p>:<p>
          We connect you with the very best practitioners and most effective
          methods to achieve optimal health.
        </p>}

        
        <div className="connect-btn">
          <NavLink
            to="/"
            exact
            activeClassName="active-btn"
            className="disable-btn"
           onClick={toggleButton}
          >
            For companies
          </NavLink>
          <NavLink
            to="/forIndividuals"
            exact
            activeClassName="active-btn"
            className="disable-btn"
            onClick={toggleButton}
          >
            For individuals
          </NavLink>
          
        </div>
      </div>
    </div>
  );
};

export default SectionConnect

无法理解我要去哪里。预先感谢！

Answer 1

像这样的onClick={()=> toggleButton()}

在toggleButton调用上

需要单击两次以更新react挂钩中的状态。切换按钮

1 个答案: