vue+element tab点击报错

clipboard.png

代码

<template>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane v-for="item in means" :label="item.name" :name="item.name" :key="item.value" :component="item.component">

  <component :is="item.component" ></component>

</el-tab-pane>
</el-tabs>
</template>
<script>
const provinceCont = resolve => require(['./provinceTab.vue'], resolve);
const prisonCont = resolve => require(['./prisonTab.vue'], resolve);
const departmentCont = resolve => require(['./departmentTab.vue'], resolve);
export default {

data() {
  return {
    means:[
      {name: '省份',component:provinceCont,value:'省份'},
      {name: '监狱' ,component:prisonCont,value:'监狱'},
      {name: '部门', component:departmentCont,value:'部门'}
    ],
    activeName: '省份',

  };
},
methods: {
  handleClick (tab, event) {
    // 异步加载组件
    let getCompoentIndex = this.means.findIndex(x => x.name === tab.name);
    let component = this.means[getCompoentIndex].component;
    if (!this.items[getCompoentIndex].loading) {
      this.items[getCompoentIndex].loading = true;
      Vue.component(component, function (resolve, reject) {
      //  setTimeout(function () {
          require([`./${component}.vue`], resolve)//比如 abc.vue
     //   }, 1000)
      })
    }
  }

}

};
</script>

阅读 3.5k
1 个回答

这应该属于自定义事件了,你可以通过来 emit 触发

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题