动态加载多个子组件

动态加载多个子组件

应用场景:

页面分析:

页面上半部分为客户基本信息(组件),下半部分为一个tabs(组件),在tabs中的每一个tab又为一个组件.

代码展示:

客户基本信息组件↓
tabs组件↓

tabs中的tab组件↓

在tabs组件页面引入各个tab组件

在data中声明

export default {
   
  components: {
   
    customerLog,
    customerRecord,
    customerField,
    OrderNew,
    OrderList,
    ChatRecord
  },
  data() {
   
    return {
   
      componentsName: [
        {
    name: "3"