How to rerender children whenever a signal changes?
Hey there! I'm really new to Solid, so I built a tic-tac-toe game to understand more about it. I got it working having everything written in a single component. After that I wanted to extract part of the code to a new component called
Board. However, after doing this, I realized that everything inside the Board component wasn't being rerendered when the squares signal changes. How can we make it rerender on changes to the signal? Is there a something similar to "createEffect" for components?
Here is the source code: https://github.com/ubmit/tic-tac-toe-solid/blob/main/src/App.tsx
Thanks!
PS.: here is the previous commit, before the Board component was created, and when it was still working well https://github.com/ubmit/tic-tac-toe-solid/blob/8b5dd824b58c1cd3a671a23b5583e6d7a2dc69dc/src/App.tsxGitHub
tic-tac-toe-solid/src/App.tsx at main · ubmit/tic-tac-toe-solid
Contribute to ubmit/tic-tac-toe-solid development by creating an account on GitHub.
GitHub
tic-tac-toe-solid/src/App.tsx at 8b5dd824b58c1cd3a671a23b5583e6d7a2...
Contribute to ubmit/tic-tac-toe-solid development by creating an account on GitHub.
2 Replies
Don't destructure the props
Unlike React, components don't rerun in Solid
Solid's props are a bit special since they get transformed into getters by the solid transform. Destructuring them causes the props to lose reactivity
Ohhhhhhh i see
I knew about that they don't re-run
So that's why I thought I had to do something to make it "subscribe" to the signal
It turns out it was way simpler than that
Thank you!