🖥
Nuxt 3.12.1 の useState の不具合
例
こんな簡単なコードでも正常に動かない
<script setup lang="ts">
const counter = useState('counter', () => 0)
</script>
<template>
<div>
Counter: {{ counter }}
<button @click="counter++">+</button>
<button @click="counter--">-</button>
</div>
</template>
暫定解決
plugins/payload-reactivity.client.ts
ファイルを以下の内容で作成すると動くようになった
export default defineNuxtPlugin(nuxtApp => {
const payload = nuxtApp.payload
for (const key in ['_errors', 'data']) {
if (!isReactive(payload[key])) {
payload[key] = shallowReactive(payload[key])
}
}
if (!isReactive(payload.state)) {
payload.state = reactive(payload.state)
}
})
正式対応
次のバージョンを待つのが良さそう
Issue
チャットメンバー募集
何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。
プロフィール・経歴
公開日時
2024-06-14
Discussion