React 路由器 v4 - activeStyle 和 activeClassName 不工作
React router v4 - activeStyle and activeClassName not working
出于某种原因,我的 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>
);
}
}
我认为唯一的问题是缺少斜杠,意思是:
<NavLink activeStyle={{ color:'red' }} to="/archives"> Archives </NavLink>
<NavLink activeClassName="active" to="/settings"> Settings </NavLink>
应该可以。
出于某种原因,我的 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>
);
}
}
我认为唯一的问题是缺少斜杠,意思是:
<NavLink activeStyle={{ color:'red' }} to="/archives"> Archives </NavLink>
<NavLink activeClassName="active" to="/settings"> Settings </NavLink>
应该可以。