react router4 NavLink怎么没用啊

Question

先面试我的代码

render() {
    let MENULISTLI = this.state.list.map((item, index) => (
        <li key={index} onClick={this.changeLi.bind(this, item)} className="nav-li">
            <NavLink activeClassName="active-menu" to={item.topage}>
                <Icon type={item.icon} />
                <span className="menu-text">{item.text}</span>
            </NavLink>
        </li>
    ))
    let MORELI = this.state.moreList.map((item, index) => (
        item.map((items, indexs) => (
            <li key={indexs} className={indexs === 0 ? 'more-list' : this.state.unfoldList === items.sub ? 'nav-li' : 'nav-li more-nav'} onClick={this.changeLi.bind(this, items)}>
                <span style={{ display: indexs === 0 ? 'inline-block' : 'none' }}>
                    <Icon type={this.state.unfoldList === items.sub ? 'caret-down' : 'caret-right'} />
                    <span className="menu-text">{items.text}</span>
                </span>
                <NavLink activeClassName="active-menu" to={items.topage} style={{ display: indexs === 0 ? 'none' : 'inline-block' }}>
                    <Icon type={items.icon} />
                    <span className="menu-text">{items.text}</span>
                </NavLink>
            </li>
        ))
    ))
    let MOREMENU = this.state.list.map((item, index) => (
        <ul key={index}>
            {MORELI[index]}
        </ul>
    ))
    return (
        <div className={this.state.collapsed ? 'menu-container unfold' : 'menu-container'}>
            <p className="menu-isout" onClick={this.toggleCollapsed}>
                <Icon type={this.state.collapsed ? 'menu-unfold' : 'menu-fold'} />
            </p>
            <div className="menu-all">
                <ul className="menu-list">
                    {MENULISTLI}
                </ul>
                {MOREMENU}
            </div>
        </div>
    );
}

这是我的代码，求大神看看，为什么NavLink的activeClassName不起作用啊，导航栏点击之后Class没有改变

Answer 1

你是用VScode自带终端启动的吧？用系统命令行或Gitbush启动项目应该就能解决了