Autodesk / Autodesk/react-base-table

Invalid ref in NextJS

Ouverte
#387 0 commentaires 0 réactions 0 personnes assignées Voir sur GitHub
Langage dominant
TypeScript
Étoiles
1.5k
Forks
170
Métriques de merge des PR
Aucune PR mergée en 30 j

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.

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par l’exemple « Inline Editing » du site de documentation et par l’implémentation personnalisée de EditableCell, en vous concentrant sur la manière dont son ref est transmis et sur le moment où targetRef devient disponible. Reproduisez l’exemple dans un environnement NextJS, puis vérifiez que les éléments des cellules peuvent être modifiés de manière fiable sans que ref soit null lors du rendu initial.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
next.js, react, typescript
Domaine
frontend
Type d'issue
Bug
Difficulté
4/5
Temps estimé
3-5 jours
Activité
À l'abandon
Clarté
Plutôt claire
Accessibilité débutants
25/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.