How to load about components asynchronously in Vue

This article mainly introduces the relevant knowledge of how to load about components asynchronously in Vue, the content is detailed and easy to understand, the operation is simple and fast, and has a certain reference value, I believe you will have something to gain after reading this Vue article on how to load about components asynchronously, let's take a look.

Load about components asynchronously

About.js

Vue.component ('about', {template:' ABOUT PAGE'})

Html Code:

/ home / about function load (componentName, path) {return new Promise (function (resolve, reject) {var script = document.createElement ('script'); script.src = path; script.async = true; script.onload = function () {var component = Vue.component (componentName); if (component) {resolve (component)) } else {reject ();}} document.body.appendChild (script);}) } var router = new VueRouter ({routes: [{path:'/', redirect:'/ home'}, {path:'/ home', component: {template: 'HOME PAGE'}}, {path:' / about', component: function (resolve, reject) {load ('about') 'static/js/business/about.js') .then (resolve, reject) }}]}); var app = new Vue ({el:'# app', router: router}); that's all for the article on "how to load about components asynchronously in Vue". Thank you for reading! I believe you all have some knowledge about "how to load about components asynchronously in Vue". If you want to learn more, you are welcome to follow the industry information channel.