nuxt: useState broken in Nuxt 3.4.0
Environment
- Operating System: Linux
- Node Version: v16.14.2
- Nuxt Version: 3.4.0
- Nitro Version: 2.3.3
- Package Manager: npm@7.17.0
- Builder: vite
- User Config: -
- Runtime Modules: -
- Build Modules: -
Reproduction
Minimal examples:
Nuxt 3.3.3: https://stackblitz.com/edit/github-msmhxs-kcquo4 Nuxt 3.4.0: https://stackblitz.com/edit/github-msmhxs-i2vnvr
Describe the bug
useState appears not to be reactive in Nuxt 3.4.0. Watchers do not get triggered and views are not updated when the useState ref changes.
Compare the minimal examples for Nuxt 3.3.3 and Nuxt 3.4.0. Nuxt 3.3.3 behaves as expected when the button is clicked, in the Nuxt 3.4.0 example nothing changes when the button is clicked.
Additional context
No response
Logs
No response
About this issue
- Original URL
- State: closed
- Created a year ago
- Reactions: 13
- Comments: 18 (7 by maintainers)
You can try working around for the moment with
experimental.renderJsonPayloads.That works! Hopefully soon functionality is restored without experimental flags 😊.
The workaround does not work for us. Unfortunately, I am unable to share relevant code.
@danielroe Sorry, when I went to produce a minimal reproduction I realised it was a mistake on my part
Setting experimental: { renderJsonPayloads: true } gives the following error:
[nuxt] [request error] [unhandled] [500] Cannot stringify arbitrary non-POJOs
Same with
useColorMode(), the returned object is not reactive.Workaround works, but it shouldn’t be a solution.
I’d guess that it’s most likely required to know what data (“non-POJO”) is tried to be stringified, so the stacktrace alone does not give enough telemetry to fix a potential bug.