Javascript React路由器v4-activeStyle和activeClassName不工作

出于某种原因，我的用于NavLink组件的activeStyle和activeClassName道具无法工作。我做错什么了吗？也许我正在使用v3语法

import React from "react";
import {NavLink, Route} from "react-router-dom";

//...Imports of router components

export default class Layout extends React.Component {
    render() {
        return (
            <div>
                <NavLink activeStyle={{ color:'red' }} to="archives">
                   Archives
                </NavLink>
                <NavLink activeClassName="active" to="settings">
                    Settings
                </NavLink>
                //...Routes are here
            </div>
        );
    }
}

从“React”导入React；
从“react router dom”导入{NavLink，Route}；
//…路由器组件的进口
导出默认类布局扩展React.Component{
render（）{
返回(
档案室
设置
//……路线在这里
);
}
}

我认为唯一的问题是缺少斜杠，意思是：

<NavLink activeStyle={{ color:'red' }} to="/archives"> Archives </NavLink>    

<NavLink activeClassName="active" to="/settings"> Settings </NavLink>

存档
设置

---

应该有用

就是它！我不知道为什么我这么愚蠢，不去尝试