Yes, I use Vue.component(name, promise) to register my components.
When my Vue instance is mounted, I set the language, and it triggers the loading of corresponding articles' components. Here is a simplified version of my code:
function load_article(article, header, err_code) {
// here, "article" is the raw html of my article
// We'll insert it into the article's template
return {
data: {// some data...
},
template: `a template ${article} that encapsulate each article`
}
}
function loader (header) {
return (resolve, reject) => {
vm.make_promise({
url: `/article/${lang}/${header.name}.html`
})
.then((data) => {
resolve(load_article(data, header, 200))
})
.catch((data) => {
resolve(load_article(data, header))
});
}
}
var lang = vm.lang;
headers = articles_headers();
var loaded_articles = {};
for(var i in headers) {
header = headers[i];
Vue.component(`${lang}-${header.name}`, loader(header));
loaded_articles[`${lang}-${header.name}`] = true;
}
return loaded_articles;
And then, I have the code I wrote in my previous comment, with "curent_page" being the name of the article.
But, if we provide an article name that does not exists (and so, a component that is not registered), Vue shows a warning in the console, and that's all: [Vue warn]: Unknown custom element ....
Perhaps there's a way to tell Vue to call a given function when this happens?
No, I don't use webpack.
Yes, I use
Vue.component(name, promise)
to register my components.When my Vue instance is mounted, I set the language, and it triggers the loading of corresponding articles' components. Here is a simplified version of my code:
And then, I have the code I wrote in my previous comment, with "curent_page" being the name of the article.
But, if we provide an article name that does not exists (and so, a component that is not registered), Vue shows a warning in the console, and that's all:
[Vue warn]: Unknown custom element ...
.Perhaps there's a way to tell Vue to call a given function when this happens?
you should be able to check if the component is register by accessing
Vue.options.components