Static GitHub Issues

[2999] Get component's options in plugin by routeRecord failed

prev: Duplicated behavior in socket example
next: Use environment variables inside nuxt.config.js

I am trying to use vue-kindergarten as a plugin not as the way shown at their official site which the beforeEach hook is set in the router middleware.

The context is that I set perimeters in each page and would like to get this option before the router routes to the target page. When I tried get the options from the to route by:

const { options } = routerRecord.components.default;
const { perimeters } = options;

I found that the first routing from the client-side, the routerRecord.components.default will get a webpack generated function that returns a Promise. And will get a VueComponent constructor after the first call. The first value is as the following:

var _7ff4353d = function _7ff4353d() {
  return import('../pages/news.vue' /* webpackChunkName: "pages/news" */).then(function (m) {
    return m.default || m;
  });
};

My guess is that during the first call to routerRecord.components.default, vue components are still not resolved and is dynamically generated after that. If this is right, I am wondering if there is a way to get the page specific options from the beforeEach hook in a plugin without initiating the VueComponent in advance?

Seems like the beforeEach hook should still put in the middleware just like the official example shows in this case. LOL

#2941

<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c2599">#c2599</a>)</em></sub></div>