Vue-router разрешает URL сервером - PullRequest
0 голосов
/ 03 октября 2019

У нас есть проект spa vuejs с несколькими типами страниц, например: дом, категория, продукт, корзина, оформление заказа. Каждая категория (или продукт) имеет уникальный URL-адрес (удобный URL-адрес), поэтому мы должны отправить запрос на сервер, чтобы проверить, какиеЭто тип страницы для URL.

Мы не можем найти лучшие практики или официальные учебники для него. Для решения этой проблемы мы используем перехват маршрутизатора: beforeEach.

Вот часть нашей реализации маршрутизатора:

import VueRouter from 'vue-router';

export default (routes) => {
  const router = new VueRouter({
    mode: 'history',
    routes: routes.filter(route => route.path === '*'),
  });

  router.beforeEach(async (to, from, next) => {
    if (to.name) {
      next();
      return;
    }

    const url = to.path;
    const { type: pageType, entity_id: entityId, redirect } = await RouteModel.getRoute({ url });

    if (redirect) {
      next(redirect);
      return;
    }

    if (pageType != null
      && routes.some(({ name }) => name === pageType)
    ) {
      router.addRoutes(
        routes
          .filter(route => route.name === pageType)
          .map(route => ({
            ...route,
            path: to.path,
            meta: { ...route.meta, pageType, entityId, storeId },
          })),
      );

      next({
        path: to.path,
        query: to.query,
      });

      return;
    }

    next();
  });

  return router;
};

Я думаю, что это действительно базовая функциональность, которую должен поддерживать маршрутизатор. Может быть, кто-нибудь знает лучший способ решить эту проблему лучше?

...