Autodesk / Autodesk/react-base-table
Invalid ref in NextJS
- Lenguaje dominante
- TypeScript
- Estrellas
- 1.5k
- Forks
- 170
- Métricas de merge de PR
- Sin PR fusionados en 30 d
Descripción
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.
Guía de contribución
Línea de trabajo
Comienza con el ejemplo de «Inline Editing» en el sitio de documentación y la implementación personalizada de EditableCell, centrándote en cómo se pasa su ref y cuándo pasa a estar disponible targetRef. Reproduce el ejemplo en un entorno NextJS y, después, verifica que los elementos de las celdas se puedan editar de forma fiable sin que ref sea null durante el renderizado inicial.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- next.js, react, typescript
- Área
- frontend
- Tipo de issue
- Error
- Dificultad
- 4/5
- Tiempo estimado
- 3-5 días
- Estado de actividad
- Estancado
- Claridad
- Bastante claro
- Aptitud para principiantes
- 25/100