question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Link inside Cell causes page refresh

See original GitHub issue

I’m not being rude or anything, and I definitely understand everybody has work to do and it is difficult to spend time on issues. But my question, which in my opinion is valid, on the spectrum forum, which was over a month ago, didn’t receive a single comment (I deleted my account after that). And I can’t find a better way to solve that without opening an issue here.

I’ve posted the question again here. And I will post it here as well.

A Link (from react-router-dom) inside a Cell causes the entire page to refresh. But the same link outside the react-table works just as it is supposed to (no refresh). My react-table has no special configuration; just has custom styling. The snippet I used is from one of the issues, which goes like this:

...,
Cell: ({ row }) => (
    <Link to={{ pathname: `/dashboard/list/${row.id}` }}>{row.id}</Link>
),
...

The link is clickable and goes to the right component. But it causes a refresh. Is this expected behavior or am I going wrong somewhere?

Other useful info:

"react-table": "^6.9.2",
"react": "^16.8.4",
"react-dom": "^16.8.4",
"react-scripts": "^2.1.8",
"react-router-dom": "^4.4.0",

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:9

github_iconTop GitHub Comments

2reactions
tannerlinsleycommented, May 1, 2019

Glad we got it figured out!

0reactions
jogooolcommented, Apr 15, 2020

I have a side menu that will close when I clicked any area of the document ( adding addEventListener to the document). now I face a problem with clicking the value of the cell, the onClick is not working with the Cell (custom rendering), even when I use getProps or getTdProps, I tried e.stopPropagation() and e.nativeEvent.stopImmediatePropagation(), unfortunately it was unsuccessful. in the normal rendering of the column when I clicked the value of cell the onClick event is triggering but when I use custom cell rendering (using Cell ) the onClick event is not triggering.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Link inside Cell causes page refresh · Issue #1329 - GitHub
A Link (from react-router-dom) inside a Cell causes the entire page to refresh. But the same link outside the react-table works just as...
Read more >
Do html links with the "#" symbols in them cause page refresh ...
No, the page does not reload. At worse the page will scroll to the top. Here's more information than you'd want: ...
Read more >
Hyperlinks are removed or invalid after you sort cells that ...
Discusses a problem in which the hyperlinks are removed or invalid after you sort cells that contain these hyperlinks in Excel.
Read more >
location.reload() - Web APIs | MDN
The location.reload() method reloads the current URL, like the Refresh button. The reload may be blocked and a SECURITY_ERROR DOMException ...
Read more >
Mobile-first Indexing Best Practices | Google Search Central
We inform site owners in Search Console of the date when their site was ... Responsive design: Serves the same HTML code on...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found