在React中,可以使用平面图标作为链接来更改路由器路由。以下是一种实现方式:
npm install react-router-dom
import { Link } from 'react-router-dom';
import { ReactComponent as Icon } from 'path/to/icon.svg';
Link
组件包裹平面图标,并设置to
属性为目标路由的路径:<Link to="/target-route">
<Icon />
</Link>
import { BrowserRouter as Router, Route } from 'react-router-dom';
// ...
<Router>
<Route path="/target-route" component={TargetComponent} />
{/* 其他路由配置 */}
</Router>
这样,当用户点击平面图标时,路由器会自动导航到目标路由,并渲染对应的组件。
领取专属 10元无门槛券
手把手带您无忧上云