fixed #591

examples/routers/table.vue

@@ -1,13 +1,14 @@
 <template>
-    <Table :columns="columns1" :data="data1">
+    <div>
-        <div slot="header">头部</div>
+        <Table :height="height" border :columns="columns1" :data="data2"></Table>
-        <div slot="footer">底部</div>
+        <Button @click="height=800">change height</Button>
-    </Table>
+    </div>
 </template>
 <script>
     export default {
         data () {
             return {
+                height: 200,
                 columns1: [
                     {
                         title: '姓名',
@@ -22,7 +23,27 @@
                         key: 'address'
                     }
                 ],
-                data1: [
+                data2: [
+                    {
+                        name: '王小明',
+                        age: 18,
+                        address: '北京市朝阳区芍药居'
+                    },
+                    {
+                        name: '张小刚',
+                        age: 25,
+                        address: '北京市海淀区西二旗'
+                    },
+                    {
+                        name: '李小红',
+                        age: 30,
+                        address: '上海市浦东新区世纪大道'
+                    },
+                    {
+                        name: '周小伟',
+                        age: 26,
+                        address: '深圳市南山区深南大道'
+                    },
                     {
                         name: '王小明',
                         age: 18,

examples/routers/tabs.vue

@@ -1,42 +1,56 @@
 <template>
-    <Row>
+    <Tabs value="name1" :animated="false">
-        <Col :span="12">
+        <Tab-pane label="标签一" name="name1">
-            <Tabs type="card" closable @on-tab-remove="handleTagRemove">
+            <Table :columns="columns1" :data="data1"></Table>
-                <Tab-pane label="标签一" v-if="tab0">标签一的内容</Tab-pane>
+        </Tab-pane>
-                <Tab-pane label="标签二" v-if="tab1">标签二的内容</Tab-pane>
+        <Tab-pane label="标签二" name="name2">
-                <Tab-pane label="标签三" v-if="tab2">标签三的内容</Tab-pane>
+            <Table :columns="columns1" :data="data1"></Table>
-            </Tabs>
+        </Tab-pane>
-        </Col>
+        <Tab-pane label="标签三" name="name3">
-        <Col :span="12">
+            <Table :columns="columns1" :data="data1"></Table>
-            <Tabs type="card" closable @on-tab-remove="handleTagRemove">
+        </Tab-pane>
-                <Tab-pane :label="tab.label" v-for="tab of tabs" :key="tab">{{tab.content}}</Tab-pane>
+    </Tabs>
-                <Button size="small" slot="extra" @click="addTab">添加</Button>
-            </Tabs>
-        </Col>
-    </Row>
 </template>
-
-
 <script>
     export default {
         data () {
             return {
-                tabs:[
+                columns1: [
-                        {label:'标签0',content:'标签内容0'},
+                    {
-                        {label:'标签1',content:'标签内容1'},
+                        title: '姓名',
-                        {label:'标签2',content:'标签内容2'},
+                        key: 'name'
+                    },
+                    {
+                        title: '年龄',
+                        key: 'age'
+                    },
+                    {
+                        title: '地址',
+                        key: 'address'
+                    }
                 ],
-                tab0: true,
+                data1: [
-                tab1: true,
+                    {
-                tab2: true
+                        name: '王小明',
-            }
+                        age: 18,
-        },
+                        address: '北京市朝阳区芍药居'
-        methods: {
+                    },
-            handleTagRemove (name) {
+                    {
-                this['tab' + name] = false;
+                        name: '张小刚',
-            },
+                        age: 25,
-            addTab(){
+                        address: '北京市海淀区西二旗'
-                this.tabs.push({label:'标签'+this.tabs.length,content:'标签内容'+this.tabs.length});
+                    },
+                    {
+                        name: '李小红',
+                        age: 30,
+                        address: '上海市浦东新区世纪大道'
+                    },
+                    {
+                        name: '周小伟',
+                        age: 26,
+                        address: '深圳市南山区深南大道'
+                    }
+                ]
             }
         }
     }

src/components/modal/modal.vue

@@ -32,12 +32,13 @@
     import TransferDom from '../../directives/transfer-dom';
     import { getScrollBarSize } from '../../utils/assist';
     import Locale from '../../mixins/locale';
+    import Emitter from '../../mixins/emitter';
 
     const prefixCls = 'ivu-modal';
 
     export default {
         name: 'Modal',
-        mixins: [ Locale ],
+        mixins: [ Locale, Emitter ],
         components: { Icon, iButton },
         directives: { TransferDom },
         props: {
@@ -247,6 +248,7 @@
                         this.addScrollEffect();
                     }
                 }
+                this.broadcast('Table', 'on-visible-change', val);
             },
             loading (val) {
                 if (!val) {

src/components/table/table.vue

@@ -664,6 +664,9 @@
             this.fixedHeader();
             this.$nextTick(() => this.ready = true);
             window.addEventListener('resize', this.handleResize, false);
+            this.$on('on-visible-change', (val) => {
+                if (val) this.handleResize();
+            });
         },
         beforeDestroy () {
             window.removeEventListener('resize', this.handleResize, false);

src/components/tabs/tabs.vue

@@ -23,11 +23,13 @@
 <script>
     import Icon from '../icon/icon.vue';
     import { oneOf, getStyle } from '../../utils/assist';
+    import Emitter from '../../mixins/emitter';
 
     const prefixCls = 'ivu-tabs';
 
     export default {
         name: 'Tabs',
+        mixins: [ Emitter ],
         components: { Icon },
         props: {
             value: {
@@ -226,6 +228,7 @@
             activeKey () {
                 this.updateBar();
                 this.updateStatus();
+                this.broadcast('Table', 'on-visible-change', true);
             }
         },
         mounted () {

src/utils/assist.js

@@ -168,14 +168,14 @@ export function scrollTop(el, from = 0, to, duration = 500) {
 }
 
 // Find components upward
-function findComponentUpward (content, componentName, componentNames) {
+function findComponentUpward (context, componentName, componentNames) {
     if (typeof componentName === 'string') {
         componentNames = [componentName];
     } else {
         componentNames = componentName;
     }
 
-    let parent = content.$parent;
+    let parent = context.$parent;
     let name = parent.$options.name;
     while (parent && (!name || componentNames.indexOf(name) < 0)) {
         parent = parent.$parent;
@@ -186,8 +186,8 @@ function findComponentUpward (content, componentName, componentNames) {
 export {findComponentUpward};
 
 // Find component downward
-function findComponentDownward (content, componentName) {
+function findComponentDownward (context, componentName) {
-    const childrens = content.$children;
+    const childrens = context.$children;
     let children = null;
 
     if (childrens.length) {
@@ -215,8 +215,8 @@ function findComponentDownward (content, componentName) {
 export {findComponentDownward};
 
 // Find components downward
-function findComponentsDownward (content, componentName, components = []) {
+function findComponentsDownward (context, componentName, components = []) {
-    const childrens = content.$children;
+    const childrens = context.$children;
 
     if (childrens.length) {
         childrens.forEach(child => {