`createEffect` doesn't working in `input.addEventListener('change')`
Here is source link: https://gitlab.com/ndt-challenge/dev.to/1st/-/blob/main/Glam%20Up%20My%20Markup/form.js?ref_type=heads
Here is demo link: https://ndt-challenge.gitlab.io/dev.to/1st/glam-up-my-markup/
The
createEffect seems to work fine expect when I try to set signal inside the input change event. What should I do to debug this case?
Update to add more info:
In the demo link, you will see the bug very clear when you try to update the select input. The expect way is the reset button should be change from disabled to not disabled.GitLab
Glam Up My Markup/form.js · main · Challenges Accepted / DEV.to / 1...
on2024(20 Mar, 31 Mar) | demo: Glam-up My Markup
7 Replies
The object doesn't change
You have the following options for solutions. You can use any of them:
1.
setRecord({...rec})
2. Use a store
3. Add {equals: false} to signal options which is the second parameter of createSignal
Also, createEffect doesn't have a dependecy array like React so no need for the [nav(), record()]
createEffect will track any signal read inside of it automaticallyBut I still need it to compare to the old value, or did I do it wrong way?
you're return is fine, you don't need the second parameter for
createEffect
oh
sorry
No that's fine, I misread the code
I thought you were trying to define a dependency array not set the initial valueThanks, so the signal actually use
Object.is() (the one that compare by pointer) under the hook rgiht? (please correct me if I'm wrong)I think the default is just
=== checkThanks for the options, I wonder what different between store and signal? Is store like an extenstion of signal or like redux store of reactjs?
Store basically will make every property of the object a signal once it's read
so you can change only a certain property of the object and react to changes only to that property. With a signal, you have to replace the whole object and anything that's listening to the signal will react to the change even if you just changed one property
In your example, you could only change
rec.table and anything that's listening to that property will be notified but not anything that is listening to rec.length for example.