Кто-нибудь знает, почему подстраница вылетает, когда пользователь перезагружает страницу? Это нормально, когда вы переходите на страницу с помощью nuxt-ссылки с другой страницы (с использованием параметров маршрута), но когда пользователь перезагружает / обновляет страницу, он будет сканировать sh.
Вот моя песочница, где Вы можете проверить это: Codesandbox
Код из nuxt-ссылки:
<nuxt-link :to="{name: 'photos-id-title', params: { id: photo.id, title: photo.title }}">
Код со страницы сведений о фотографии:
<template>
<section>
<!-- <template v-if="photo"> -->
<img
:id="photo.filename"
:src="photo.url"
class="img-fluid thumbnail rounded"
:alt="photo.title"
/>
<h1 class="h3">{{ photo.title }}</h1>
</section>
</template>
<script>
import { Annotorious } from '@recogito/annotorious'
export default {
data() {
return {
photo: {},
anno: {},
title: this.$route.params.title
}
},
async mounted() {
await this.getPhotoDoc()
this.anno = await new Annotorious({ image: this.photo.filename })
},
methods: {
async getPhotoDoc() {
const docRef = await this.$fireStore
.collection('photos')
.doc(this.$route.params.id)
.get()
try {
if (docRef.exists) {
// data() returns all data about the doc
console.log('got the doc: ', docRef.data())
this.photo = docRef.data()
} else {
console.log('no docs exist')
}
} catch (error) {
console.log('Error getting document:', error)
}
}
},
head() {
return {
title: this.photo.title,
meta: [
{
hid: 'description',
name: 'description',
content: this.photo.description
}
]
}
}
}
</script>
Путешествие пользователя : Нажмите ФОТО на панели навигации, выберите любую фотографию на странице. Вы увидите страницу с деталями фото. Грузит нормально. Попробуйте обновить sh страницу - она выдаст sh.
Примечание: у меня также есть этот каркас в обычном / обычном vue приложении с использованием Vue -cli, и у меня НЕТ проблем. Только вроде проблема с Nuxt. Должен быть связан с SSR?
Спасибо за любую помощь ...