twitter-bootstrap – 如何管理bootstrap navbar中的活动状态？

发布时间：2020-12-18 00:17:59 所属栏目：安全来源：网络整理

导读：参见英文答案 Switch class on tabs with React.js3个我知道必须在bootstrap中手动管理活动类.我用jQuery做了几次. 我的最新项目虽然有所作为. 我知道在使用react时我不应该使用jQuery在dom中设置类.但是如何才能正确完成？解决方法您只需在渲染函数中指

参见英文答案 > Switch class on tabs with React.js3个
我知道必须在bootstrap中手动管理活动类.我用jQuery做了几次.

我的最新项目虽然有所作为.

我知道在使用react时我不应该使用jQuery在dom中设置类.但是如何才能正确完成？

解决方法

您只需在渲染函数中指定选项卡的活动值即可.
要知道选项卡是否应该具有className属性的值,请将其存储在某处.

你如何在反应组件中存储东西？你使用状态.
您尚未显示任何代码,但您可以直接跟踪您所在州的当前活动标签.

你可以这样做：

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>
    );
}

警告：此代码块只是一个示例,未经过测试. (有几种方法可以做到).

您也可以查看：Switch class on tabs with React.js

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!