Nuxt/test/fixtures/basic/pages/json-payload.vue
pooya parsa 9e503be0f2
feat(nuxt): experimental option for rich json payloads (#19205)
Co-authored-by: Daniel Roe <daniel@roe.dev>
2023-04-07 03:34:35 -07:00

27 lines
913 B
Vue

<script setup lang="ts">
const state = useState(() => shallowRef({} as Record<string, any>))
if (process.server) {
const r = ref('')
state.value.ref = r
state.value.shallowReactive = shallowReactive({ nested: { ref: r } })
state.value.shallowRef = shallowRef(false)
state.value.reactive = reactive({ ref: r })
state.value.error = createError({ message: 'error' })
state.value.date = new Date()
}
</script>
<template>
<div>
<pre>{{ state }}</pre>
Date: {{ state.date instanceof Date }} <br>
Error: {{ isNuxtError(state.error) }} <hr>
Shallow reactive: {{ isReactive(state.shallowReactive) && isShallow(state.shallowReactive) }} <br>
Shallow ref: {{ isShallow(state.shallowRef) }} <br>
Reactive: {{ isReactive(state.reactive) }} <br>
Ref: {{ isRef(state.ref) }} <hr>
Recursive objects: {{ state.ref === state.shallowReactive.nested.ref }} <br>
</div>
</template>