Open page in new window when clicking a link in ReactJS

Question

In my React application, I need to open a page in new window when clicking a link in the Bootstrap table. Please help me with the example.

Earlier, I have set the table cell in a variable and assigned it to dataformat in the table header. How can I change this code to open in new window?

Update: After making the code changes as suggested below, the page is opening in a new tab but the testid is not passing to the other page (which is fetched using this.props.testid).

column1 = (cell, row) => {
  let link = `${cell}`
  return (
    <Link to={{                
      pathname: '/test',
      state: {
        testId: row.testid
      }
    }} target="_blank" rel='noopener noreferrer'>
      {cell}
    </Link>
}

Could you share your tried example ? or where get you stuck? — Maulik Sakhida
– Maulik Sakhida, Commented Nov 13, 2019 at 7:30

carrany · Accepted Answer · 2019-11-13 07:32:57Z

1

Maybe try this:

 <td onClick={()=> window.open("LinkToOpen", "_blank")}>Link</td>

answered Nov 13, 2019 at 7:32

carrany

1561 silver badge7 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

akhtarvahid · Accepted Answer · 2019-11-13 07:33:25Z

1

You can define anchor tage like this in react to open in new window

Define rel="noopener noreferrer" to avoid warning in react.

<a href="https://google.com" rel="noopener noreferrer" target="_blank">google</a>

answered Nov 13, 2019 at 7:33

akhtarvahid

9,7992 gold badges30 silver badges33 bronze badges

Comments

Maulik Sakhida · Accepted Answer · 2019-11-13 07:33:28Z

1

Use a regular link but style it as a table cell:

<a style={{display: "table-cell"}} href="someLink" target="_blank">text</a>

answered Nov 13, 2019 at 7:33

Maulik Sakhida

5014 silver badges17 bronze badges

Collectives™ on Stack Overflow

Open page in new window when clicking a link in ReactJS

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related