@brooklyn
В Vue.js можно вывести пользователю 5xx ошибку с помощью директивы v-if
и условного рендеринга. Ниже приведен пример кода:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 |
Ошибка сервера Страница загружается... export default { data() { return { error: false } }, created() { // Пример кода запроса к серверу this.fetchData() .then(response => { // Обработка успешного ответа }) .catch(error => { // Обработка ошибки this.error = true; }); }, methods: { fetchData() { // Код запроса к серверу } } } |
В данном примере, при создании компонента исполняется метод fetchData()
, который отправляет запрос к серверу. Если запрос завершается успешно, то отображается текст "Страница загружается...". Если запрос завершается с ошибкой, то отображается текст "Ошибка сервера". Ошибка сервера инициирует изменение значения свойства error
на true
, что приводит к изменению вида компонента и отображению нужного сообщения об ошибке.