小编Kan*_*ane的帖子

React bootstrap 导航栏折叠不起作用

我使用了 react bootstrap 导航栏也用于react-scroll平滑导航。它工作正常,但在响应模式下单击任何导航项时导航栏不会折叠。

套餐

import React, { Component } from "react";
import { NavLink } from "react-router-dom";
import { Link } from "react-scroll";
import { LinkContainer } from "react-router-bootstrap";
import { Navbar, Container, NavDropdown, Nav, Dropdown } from "react-bootstrap";
Run Code Online (Sandbox Code Playgroud)

导航栏

<Navbar
    sticky="top"
    id="navbar"
    bg="light"
    expand="lg"
    className="navbar navbar-expand-lg navbar-light bg-light"
    collapseOnSelect={true}
>
<Navbar.Toggle aria-controls="basic-navbar-nav" />
    <Navbar.Collapse id="basic-navbar-nav">
        <Nav className="ml-auto">
            <Link
                activeClass="active"
                to="features"
                spy={true}
                smooth={true}
                offset={-70}
                duration={800}
                className="nav-link"
                onClick={this.closeNavbar}
            >
                Features
            </Link>

            <Link
                activeClass="active"
                to="about"
                spy={true}
                smooth={true}
                offset={-70}
                duration={800} …
Run Code Online (Sandbox Code Playgroud)

javascript collapse navbar reactjs react-bootstrap

9
推荐指数
1
解决办法
1万
查看次数

反应路由器 goBack() 无法正常工作

我遇到了一个问题。我使用 react-router-dom 进行路由。它运行良好,但 goBack 无法正常运行。当我单击后退按钮时,它首先转到NotFound/Signin页,然后重定向到后页。我怎样才能克服这个问题?

import React from 'react';
import { Router, Route, Switch } from 'react-router-dom';
import createBrowserHistory from 'history/createBrowserHistory';

import Signin from '../ui/signin/Signin';
import AddEvent from '../ui/events/AddEvent';
import EventView from '../ui/events/EventView';
import NotFound from '../ui/NotFound';

const history = createBrowserHistory();
const privatePages = [
    '/events', 
    '/addevent',

];
const publicPages = ['/', '/signup','/forgotpassword'];

const onEnterPublicPage = () => {
    if (Meteor.userId()) {
        history.replace('/events');
    }
};

const onEnterPrivatePage = () => {
    if (!Meteor.userId()) {
        history.replace('/');
    } …
Run Code Online (Sandbox Code Playgroud)

javascript meteor reactjs react-router react-router-dom

5
推荐指数
1
解决办法
9145
查看次数