requirement is to first get a list of component names asynchronously, then load the components on the list according to the list (in the form of a string array), and then cycle through the page
I made one according to the vue official website. Now I can load the components asynchronously, but I don"t know how to proceed.
<template>
<div id="Menu">
<component :is="Link"></component>
</div>
</template>
<script>
const AsyncComponent = () => ({
component: import(`../plugs/Link`)
})
export default {
name: "Menu",
components: {
},
data () {
return {
plugs: []
}
},
created () {
},
computed: {
Link: function () {
return AsyncComponent
}
}
}
</script> answer from vv13:
the above example is what I am writing now, and it is easy to mislead people. I will change the example of requirements
the Link1, Link2 and other components in the examples in the current requirements do not necessarily exist, they are all a list of components obtained from another interface, for example:
<template>
<div id="Menu">
<!-- -->
</div>
</template>
<script>
export default {
name: "Menu",
components: {
// components
},
data () {
plugs: [] //
},
created () {
//
fetch("plugs.php").then((data) => data.json()).then((data) => {
// data ["Link1","Link2","components1","components2",...] components `../plugs/Link`
this.plugs = data;
})
},
computed: {
}
}
</script>