javascript - React-Router: Why won't <Link> component's onClick handler dispatch my action? -
i react-router's <link>
to fire function on click looks <link>
navigating next page before function has chance fire.
my component looks similar this:
<link to={`/path/to/${foo}`} onclick={() => myfunc(foo, bar)}> <div>this link</div> </link>
foo
, bar
props have been passed down parent components.
however, if call e.preventdefault
, subsequent functions work fine:
<link to={`/path/to/${foo}`} onclick={(e) => e.preventdefault(); console.log('this works!')}> <div>this link</div> </link>
i imagine similar this, programmatically navigate route there has better (i.e. less hack-y) way of achieving effect.
does have suggestions, might me?
this directly not solution, can try instead of using link
component, use simple a
element, , move needed route inside onclick
handler:
import { browserhistory } 'react-router'; <a onclick={ browserhistory.push(`/path/to/${foo}`) myfunc(foo, bar) }> <div>this link</div> </a>
Comments
Post a Comment