Autodesk / Autodesk/react-base-table

Invalid ref in NextJS

Open
#387 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
1.5k
Forks
170
PR merge metrics
No merged PRs in 30d

Description

Is there a way to pass the ref to custom cell renders in NextJS environment?

The [Inline Editing](https://autodesk.github.io/react-base-table/examples/inline-editing) example in the documentation website doesn't work in NextJS because the ref provided to `EditableCell` is always null. I have tried various workarounds like loading the component dynamically and then using React.ForwardRef ([link](https://github.com/vercel/next.js/issues/4957)) but nothing seems to work. Even tried disabling SSR explicitly. The ref passed in is only valid after the first render cycle and it seems in the `EditableCell` class it tries to render with a null ref. You have some code protecting against this situation: `{editing && this.targetRef && (` but I'm wondering if there is a nicer or cleaner way to do this? I'm mainly looking for a way to edit the cell items.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.