浏览器历史记录和错误的地址

我有一条路线：

<Router history={browserHistory}> 
        <Route path='/' component={Main} >
            <Route path='/genres' component={Genres} />
            <Route path='/genres/:id' component={GridMovies} /> 
    </Route>
</Router>

主要组成部分：

<div className="main-conteiner">

     <Genres />            
       {this.props.children}

</div>

流派组件可做到这一点：

let genres = this.state.genres;

        return (
            <div className="genres-list">
                {genres.map(function(key) {
                    return <Link to={"genres/" + key['id']} className='genre'>{key['name']}</Link>
                })}
            </div>
        )

我在这里列出了类型：

然后，我点击一些流派，就得到了地址：

http://localhost:8080/genres/28

它的好，那项工作。如果我再次单击，我得到了：

http://localhost:8080/genres/genres/28

一些点击，我可以得到这个：

http://localhost:8080/genres/genres/genres/genres/genres/genres/genres/genres/genres/genres/genres/genres/18

我的服务器配置：

webpack-dev-server --content-base public/ --history-api-fallback

哈希历史记录无效。我做错了什么？