微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在reactjs中切换开关

如何解决在reactjs中切换开关

当我禁用第二个按钮时,我正在启用第一个按钮。这是可行的,但不能正常进行。 我需要双击第二个按钮以启用第二个按钮并禁用第一个按钮。 我做了很多调试和搜索,但是我找不到我要去哪里。任何帮助将不胜感激。预先感谢!

反应js代码

body {
   scroll-behavIoUr: smooth;
}

CSS代码

<a href="#aboutus">Go to about us</a>

解决方法

您可以将NavLinkactiveClassName结合使用,以实现所需的功能,而无需使用本地组件状态。

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

const SectionConnect = () => {
  return (
    <div className="connect-container">
      <div className="connect-wrapper">
        <h2>How it works</h2>
        <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"
          >
            For companies
          </NavLink>
          <NavLink
            to="/forIndividuals"
            exact
            activeClassName="active-btn"
            className="disable-btn"
          >
            For individuals
          </NavLink>
        </div>
      </div>
    </div>
  );
};

Edit toggle-switch-in-reactjs

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。