vue学习笔记--v-for循环标签页label并实现根据不同label表格切换

目标：用标签页组件实现点击不同标签显示表格内容，标签页内lab le 和表格数据都是循环得到的。
效果如图：

2.png

首先 实现pane 循环出header。 v-model="tabKey"是指默认选中首页，
abel="" name=""， :key="" 是循环出数据必不可少的，

 
 
    
    tabKey:'namekey',
      header:[
    {title:'首页',key:'agekey'},
    {title:'全部',key:'namekey'},
    {title:'设置',key:'sixkey'},

  ],

接下来在嵌套表格

html:

script:

    agekey:[{
    id:'001',
    name:'汤姆',
    six:'man',
    age:'18'
     }]

到这一步，已经实现了点击标签页能显示表格数据的程度了，但是这里显示的数据并不是不一样，还需要进一步改造data数据，使 绑定数据的时候对应不同的key:' ' ,这样就可以实现点击不同的标签显示不同的ta b le 数据了