我知道必须在引导程序中手动管理活动类。我已经用 jQuery 做过几次了。
不过，我的最新项目与 react 一起使用。
我知道在使用 react 时，我不应该使用 jQuery 在 dom 中设置类。但是如何正确地做到这一点呢？
如何在react中管理引导导航栏中的活动状态？
IT技术
twitter-bootstrap
reactjs
2021-04-18 02:45:07
2个回答
您只需active在render函数中指定选项卡的值。要知道选项卡是否应该具有该className属性的值，就是将其存储在某处。
你如何在react组件中存储一些东西？你用state. 您尚未显示任何代码，但您可以简单地跟踪当前处于您状态的哪个选项卡处于活动状态。
例如，你可以有这个：
getInitialState: function() {
return { activeTabClassName: "tab1" };
}
render: function() {
return (
<ul>
<li className={(this.state.activeTabClassName === "tab1") ? "active" : ""}></li>
<li className={(this.state.activeTabClassName === "tab2") ? "active" : ""}></li>className </ul>
);
}
警告：此代码块只是一个示例，未经测试。（有几种方法可以做到）。
您还可以检查这一点：使用 React.js 在选项卡上切换类
您可以使用react-router自动或手动管理引导程序导航栏中的活动状态。