Как в nuxt.js vuex actions перенаправить на страницу 404 если от сервера пришел пустой объект?

Всем привет, имеется динамический адрес, при переходе на него происходит обращение к actions стора, как перенаправить пользователя на страницу 404 если от сервера приходит пустой объект ?
Код страницы

<template>
  <div>Динамическая страница</div>
</template>

<script>
import {mapActions} from "vuex";

export default {
  created() {
    this.loadProductData({
      productCode: this.$route.params.productCode,
      sectionCode: this.$route.params.catalogCode
    })
  },
  methods: {
    ...mapActions({
      loadProductData: "shop/loadProductData"
    })
  }
}
</script>


Код стора

export const state = () => ({
  // Данные товара
  productData: {},
})

export const mutations = {
  // Добавление данных товара
  setProductData(state, data) {
    state.productData = data
  },
}

export const actions = {
  // Подгрузка данных товара по коду категории + коду товара (slug)
  async loadProductData({commit}, slug) {
    await this.$axios.$post("http://localhost:3000/api/catalog/element/", {
      params: {
        productCode: slug.productCode,
        sectionCode: slug.sectionCode
      }
    })
      .then((response) => {
        if (response.data) {
          commit("setProductData", response.data)
        } else {
          this.app.nuxt.error({
            statusCode: 404,
            message: "Post not found",
            path: "/shop"
          })
        }
      })
  },
}

export const getters = {
  // Получение данных товара
  getProductData(state) {
    return state.productData;
  }
}


layouts для ошибки создан.
Так же вопрос, как не показывать страницу, пока не придут данные от сервера ?
Заранее спасибо.
  • Вопрос задан
  • 186 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы