前端最有成就感一—-封装

这样的需求：点击不同的标签页显示不同的分页数据

同样的标签，不同的内容，我是有几种内容就写几个标签吗？
**成就感一：只写一次el-tab-pane，label动态绑定data中的nameList数组的每一项(item)
运用知识点:v-bind动态绑定属性，v-for遍历数组的每一项，key给每一个节点做唯一标识

点击el-tab-pane显示不同表格内容，我是直接在该标签内写吗？
成就感二：通过使用动态组件，完成点击不同标签页时的页面切换。同一文件夹下声明子组件-》父页面导入子组件-》components属性中挂载子组件-》使用子组件。
**遇到的小问题：导入子组件时:import table from ‘./table’ -》使用时
< table> < /table>出错，因为table标签有原有意义，要避重名

父子组件传值：
父传子：在父组件使用子组件时自定义属性，在子组件中通过props接收
子传父：$emit通过事件传值
！！！但是现在情况是：由于标签是循环来的，如果写死所传的值如下
那么会造成每一个标签所接收的msg均为"hello"，但显然我们的需求是点击不同标签页时向父组件传递不同的内容（父组件向子组件触发事件传值）

**vue中操作dom的方法:通过ref=‘msg’起名称，this. $refs.msg获取dom对象，但由于是循环创建的，所以通过
this. $refs.msg[tab.index]获取当前点击的dom元素

成就感三：子组件声明的函数，父组件调用该函数传值

子组件拿到标签名称name，封装对象查询并显示便轻而易举了