Как я могу вернуть ошибку 404 без изменения URL в Vue? - PullRequest
Новая
       21

Как я могу вернуть ошибку 404 без изменения URL в Vue?

0 голосов
/ 15 марта 2019

Вопрос

Как использовать Vue.js, как я могу вернуть ошибку 404 в динамический маршрут без изменения URL?

Часть моего route.js (все в порядке) 

{

    path: '/work/:id',
    name: 'work',
    component: () => import( './views/Work.vue' )

},

{

    path: '*',
    name: 'NotFound',
    component: () => import( './views/NotFound.vue' )

}

Часть компонента Work.vue.Где я проверяю, есть ли параметр маршрута в моем статическом json, если нет, откройте компонент NotFound до того, как маршрут введите 

beforeRouteEnter (to, from, next) {
    next(vm => {
        vm.item = json.find(item => item.id == vm.$route.params.id)

        if(!vm.item) {
            next({name: NotFound})
        }

    })
}

Проблема

Когда я пытаюсь site.com / work / non-existing-id , компонент "NotFound" открыт, но URL-адрес изменяется с site.com / work / non-existing-id на site.com

Что я ожидаю

site.com / work / non-existing-id открытый компонент "NotFound"и URL-адрес остается на site.com / work / non -existing-id

Пример

https://vuejs.org/v2/guide/something - возврат 404ошибка и остаться в URL

1 Ответ

0 голосов
/ 15 марта 2019

Маршрутизаторы предназначены для того, чтобы делать именно то, что вы от них хотите. Если вы хотите отобразить какой-либо контент на любом маршруте в вашем приложении, я бы порекомендовал создать новый компонент и, возможно, запустить событие, чтобы показать любой контент, который вы хотите.

Лично я бы подумала, что нужно изменить маршрут, потому что это позволит пользователю нажать кнопку «Назад» в браузере, чтобы вернуться туда, откуда он пришел, но я думаю, что все зависит от вашего конкретного использования. дело здесь.

...