Почему в Nuxt.js ssr не видит переменную?

есть страница города

<template>
  <div class="app-page">
    <div class="content-header">
      <h1>Редактирование</h1>
    </div>
    <div class="content-body">
      <div class="row">
        <div class="col-xl-9">
          <div class="form-group">
            <input type="text" class="form-control" placeholder="Заголовок" />
          </div>
          <div class="form-group">
            <input type="text" class="form-control" placeholder="Заголовок" />
          </div>
        </div>
      </div>
      <button class="btn btn-default" @click.prevent="save">Сохранить</button>
    </div>
  </div>
</template>

<script lang="ts">
import {
  defineComponent,
  onMounted,
  reactive,
  ref,
  ssrRef
  useContext,
} from '@nuxtjs/composition-api'
import { useFindById } from '~/composition/database/findById'

export default defineComponent({
  setup() {
    const form = reactive({
      name: '',
      slug: '',
    })

    const { params } = useContext()

    const url = ref(`/v1/admin/country/${params.value.countryId}`)
    const { result } = useFindById(url.value)

    onMounted(() => {
      form.name = result.value.name
      form.slug = result.value.slug
    })

    return { result, form }
  },
})
</script>

файл useFindById

import { useContext, ref, useFetch } from "@nuxtjs/composition-api"

export function useFindById(url) {
  const result = ref(null)
  const query = ref(null)

  const { $axios } = useContext()

  useFetch(async () => {
    try {
      query.value = await $axios.$get(url)
      result.value = query.value.data
    } catch (error) {
      console.log(error)
    }
  })

  return { result }
}

у меня NuxtJs SSR

при переходе на страницу города выдает

не хнаю, как правильно присвоить значения

Cannot read property 'name' of null
An error occurred while rendering the page. Check developer tools console for details.

ERROR in pages/settings/countries/_countryId.vue:46:19
TS2531: Object is possibly 'null'.
    44 |     onMounted(() => {
    45 |       form.name = result.value.name
  > 46 |       form.slug = result.value.slug
       |                   ^^^^^^^^^^^^
    47 |     })
    48 |
    49 |     return { result, form }

Ответы (0 шт):