Samurai Jack
Samurai Jack

Reputation: 3125

How to make a button redirect to another page in React

I have a component which has in its Class.propTypes a function onClick: onClick: PropTypes.func

In another component I'm using this component multiple times to populate a page. Each of these components have a title which when clicked should redirect to another page.

The problem I have is that it doesn't work when I click on it. It does nothing. This is the render of the main component:

render() {
    return (
            <Class
    title={account.AccountName}
    onClick={() => "mySite/accountview?id=" + account.AccountName} 
         >
         </Class>
          ...
    );
}

What should I add to onClick to make it work?

Upvotes: 5

Views: 20975

Answers (1)

Gabriel Ferreira
Gabriel Ferreira

Reputation: 330

You need use React Router.

With Link:

<Link to={`/mySite/accountview?id=${account.AccountName}`}>something</Link>

With onClick:

<button onClick={() => hashHistory.push(`/mySite/accountview?id=${account.AccountName}`)}></button>

You can use hashHistory or browserHistory :D

Upvotes: 2

Related Questions