iviewUI-Tabs选项卡切换组件

概述 

选项卡切换组件，常用于平级区域大块内容的的收纳和展现。

源码地址：https://github.com/iview/iview/tree/2.0/src/components/tabs

使用：

在源码的tabs文件下有三个文件：index.js,tabs.vue,pane.vue

index.js中引入了tabs.vue和pane.vue.

import Tabs from './tabs.vue';
import Pane from './pane.vue';

Tabs.Pane = Pane;
export default Tabs;

tabs.vue

tabs.vue是整个组件的容器，分为三部分：

1 通过 扩展tabs选项的附加内容。

2 通过this.$children获取tabs下的每一个TabPane并放进navLIst，遍历navLIst设置tabs选项标签。

3 声明slot接收整个panes。

this.$children查找当前组件的直接子组件，可以遍历全部子组件， 需要注意 $children 并不保证顺序，也不是响应式的。

slot 插槽
父级模板里的所有内容都是在父级作用域中编译的；子模板里的所有内容都是在子作用域中编译的。Slot分发的内容，作用域是在父组件上

pane.vue

pane窗格文件主要作用是，接收传进来name，label,icon,disabled,closable,tab,index参数，和父组件传进来的注入inject: ['TabsInstance'],以获取父组件的this引用.以便在参数及销毁时调用父组件的updateNav更新每一个tab.

provide/inject

在vue中不同组件通信方式如下:
1.父子组件，通过prop
2.非父子组件，通过vuex或根vue转载器

通常是以上两种情况，然而还有一种比较特殊的情况，即孙子组件或更深层次的组件通信

为什么不用vuex，简单省事????
有很多为了这个引入vuex会导致代码性价比比较低，项目本身没有使用vuex的必要
1.provide就相当于加强版父组件prop
2.inject就相当于加强版子组件的props 

缺点
这么做也是有明显的缺点的，在任意层级都能访问导致数据追踪比较困难，因此这个属性通常并不建议使用。能用vuex的使用vuex，但是在做组件库开发时，不对vuex进行依赖，且不知道用户使用环境的情况下可以很好的使用