Signal update not causing re-render
Nadie ha tomado este issue todavía.
- Lenguaje dominante
- MDX
- Estrellas
- 292
- Forks
- 361
- Merge medio
- 7 h 51 min
- PR fusionados (30 d)
- 1
Descripción
Describe the bug
This may be a me problem, but I am confused and imagine this is well above my understanding. I'm having trouble with a simple re-render when an onMount function changes a signal from false to true--in this case, used to signify that loading has finished. I have tinkered with a few things trying to get this app to work. It's a template using Colyseus + Phaser for a multiplayer server. I've added Solid JS to the front-end as per a previous, functioning app, and that's where all the trouble began!
This template is using parcel to bundle, and I've tried to maintain that, but it has been tricky integrating Solid. I've had to create
.babelrc file,
parcel.config.js file,
and update the tsconfig to
"jsx": "preserve",
"jsxImportSource": "solid-js/h" (in order to get it to stop screaming at me about a jsx-dev-runtime error)
In doing so, I've finally been able to get it to accept using Solid js, but now it's simply not rendering a signal change in the return's body.
Your Example Website or App
Steps to Reproduce the Bug or Issue
export default function App() {
const [menu, setMenu] = createSignal<boolean>(false);
onMount(() => {
console.log(menu(), 'Current Menu');
setMenu(true);
console.log(menu(), 'Current Menu');
});
return (
<div id="app">
<Show when={menu()} fallback={<Puff color="gold"/>}>
<div class='superCenter'>
<div>The Ascean</div>
<button>Enter Game</button>
</div>
</Show>
</div>
);
};
This is the smallest version of getting at what I'm talking about, it's simply not updating its render of the signal and reflecting that in the return.
the app above shows how it functions when it does work (this is a front-end only, single player version of the same concept I'm redesigning to incorporate a server for multiplayer)
Expected behavior
I expected it to update the rendering, but instead it remains stuck with it seeing the fallback of the Show component, a Puff from solid-spinner
Screenshots or Videos
https://github.com/user-attachments/assets/23b0900f-fdfc-4631-b6fb-70ab219a7558
Platform
- OS: [e.g. macOS, Windows, Linux]
- Browser: [e.g. Chrome, Safari, Firefox]
- Version: [e.g. 91.1]
Additional context
Apologies if this is a known issue, I've been trying to get this to work for a couple days now and after running into multiple, fixable errors, this seems like one that's just above my head.
Guía de contribución
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Línea de trabajo
Empieza con la función App y su uso de createSignal, onMount y Show; después, revisa la configuración mencionada de .babelrc, parcel.config.js y tsconfig. Reproduce el ejemplo mínimo y compara la integración de Solid con la aplicación funcional enlazada; se considera terminado cuando se haya identificado por qué el cambio de la señal no actualiza la rama renderizada.
Escrito por el modelo de indexación a partir del texto del issue.
Evaluación
- Stack tecnológico
- javascript, typescript
- Área
- build-system, frontend
- Tipo de issue
- Error
- Dificultad
- 4/5
- Tiempo estimado
- 3-5 días
- Estado de actividad
- Estancado
- Claridad
- Necesita aclaración
- Aptitud para principiantes
- 25/100