Autodesk / Autodesk/react-base-table
Invalid ref in NextJS
- 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