您正在使用react-router，因此不要使用a和href，而是使用Link，如下所示：

<li>
    <Link to="/">
        <i className="fa fa-sign-out pull-right"></i> 
        Log Out
    </Link>
</li>

由于Homepage组件是您的indexroute，因此导航到/将render它。
如果你想在任何函数中动态导航，请检查以下答案：
Programmatically navigating in React-Router v4

我假设你使用的是react-router v2.x.x。你可以创建一个像下面这样的组件。
您的路由还应包含您要重定向到的路由。

<Route path="/" component={App}>
       <Route path="/homepage" component={Homepage}/>
   </Route>

class Logout extends React.Component {

    static contextTypes = {
        router: React.PropTypes.object.isRequired
    };

    constructor(props, context){
        super(props, context);
        this.state = {
            error:null
        };
    }

    logOut() {
        Api.logOut().then(
            () => {
                this.context.router.replace('/homepage');
            },
            () => {
                this.setState({
                    error:'Error occured while logging out. Please try again.'
                });
            }
        );
    }

    render(){

        return (
       <li>
          <a onClick={this.logOut} >
             <i className="fa fa-sign-out pull-right"></i> 
             Log Out
          </a>
       </li>
        )
    }
}

ReactDOM.render(<Logout/>, document.getElementById('app'))

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

<div id='app'/>

在jsx组件头上单击Logout按钮时调用函数重定向。jsx下面的代码重定向到登录页面

logoutCall = () => {
    window.localStorage.clear();
};  
goLogin = () => {
   window.localStorage.clear();
   <Link to="/login"></Link>
  };    

<Link className="linkLogoutClass" to="/login" onClick={this.logoutCall}><img style={{cursor: 'pointer'}} className="logoutImageStyle " src={logout} onClick={this.goLogin}   ></img> Logout</Link>