Problem with creating Link anchor in react!?

Question

React

Good day
I’m just learning with react, that’s why such problems arise ...
The essence of the problem is to create a standard anchor transition on the landingpage, there were no problems with this before, but nothing works here ..
As far as I understand, the problem is that they are involved here route and it's probably blocking the transition..

<ul className="nav navbar-nav pull-right" id = "myPills">
                <li><Link to ="/" activeClassName="" id = "indexNav">HOW IT WORKS</Link></li>
                <li><Link to="/#top" activeClassName="">ABOUT US</Link></li>
                <li><Link to="/" activeClassName="">PRACING</Link></li>
                <li><Link to="/form/Eligibility" activeClassName="active">FORM</Link></li>
            </ul>
    ....................................
              <div id='top'> </div>
...............................................
Примеры моих роутов....
var routes = <Route name="Main" path="/" component={App} history={hashHistory}>
                <IndexRoute name = "index"  component = {Landing}/>
                <Route path = "form" name = "index"  component = {FormPage}>
                    <Route name="Eligibility" path="Eligibility" component={Eligibility} />
                    <Route name="Personal" path="InterpreterContact" component={InterpreterContact}/>
                    <Route name="Biographic" path="Biographic" component={Biographic}/>
                </Route>                
            </Route>

Please tell me how to do this, thanks!

Answer 1

https://www.npmjs.com/package/react-scrollable-anchor

Answer 2

I don't really remember how I solved this problem. But look at the source code - you assign id to the blocks, they must be set not just as id="bla", but as id={"bla"} and then the anchors start to work.
p.s.
not sure :)