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

In another ponent I'm using this ponent multiple times to populate a page. Each of these ponents 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 ponent:

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

What should I add to onClick to make it work?

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

In another ponent I'm using this ponent multiple times to populate a page. Each of these ponents 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 ponent:

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

What should I add to onClick to make it work?

• javascript
• reactjs

• is the page you want to go to within the same React App or an external website? Are you using some kind of routing library, such as react-router? – Chris Commented Jun 21, 2017 at 13:02
• same React App, I'm not using routing library. accountview is the name of that ponent – Samurai Jack Commented Jun 21, 2017 at 13:03
• 1 Then I suggest you install react-router first and add your pages to the router. – Chris Commented Jun 21, 2017 at 13:05
• I guess it will be too difficult to do that. The project is pretty big and also has parts and pages written in vb and other languages – Samurai Jack Commented Jun 21, 2017 at 13:08
• 1 In that case I would still add react-router and use Gabriels solution below. The former for navigating within the react app, and the latter for external sites. – Chris Commented Jun 21, 2017 at 13:13

1 Answer 1

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