如何在React.js中添加到图像的路由

时间:2019-07-19 13:57:46

标签: html reactjs

我需要在徽标图像上添加路线。我的意思是,当我单击徽标图像时,它应该重定向到仪表板页面。我尝试使用锚标记执行此操作,但是它无法正常工作

 <Header className='header' style={{ position: 'fixed', width: '100%' }}>
      <div className='header-logo' style={{ width: collapsed ? 80 : 200, height: 0 }}>
        {collapsed &&
        <a href="/dashboard">
          <img src={minLogo} alt='Logo' />
        </a>
        }
        { !collapsed &&
          <span>&nbsp;</span>
        }
      </div>
      <Icon
        className="trigger"
        type={collapsed ? 'menu-unfold' : 'menu-fold'}
        onClick={this.toggleSideBar}
      />
      <div style={{ display: 'inline-block', float: 'right' }}>
        <Dropdown overlay={menu} placement="bottomRight">
          <Avatar icon='user' />
        </Dropdown>
      </div>
    </Header>

2 个答案:

答案 0 :(得分:4)

尝试

import {  Link } from "react-router-dom";


<Link to="/dashboard">
    <img src={minLogo} alt='Logo' />
</Link>

答案 1 :(得分:1)

用户路由器Link而不是锚点:

    <Link to="/dashboard">
      <img src={minLogo} alt='Logo' />
    </Link>