[Bug Report] el-table will cause the parent component is rendered two times

[breath-co2]

Element UI version

2.0.2

OS/Browsers version

MacOS 10.13.1 / Chrome 63.0.3239.30

Vue version

2.5.2

Reproduction Link

https://jsfiddle.net/pj71jkyw/691/

Steps to reproduce

我实际中的代码是将 el-table 封装成一个子组件的，也是发现被执行2次，如下：

// myTable.js
export default {
    props: ['columns', 'data'],
    render: function (h) {
        console.log('render..........');
        console.error(new Error());

        let objs = [];
        this.$props.columns.forEach((item) => {
            let attrs = JSON.parse(JSON.stringify(item));
            objs.push(h('el-table-column', {attrs: attrs}));
        });

        return h('el-table', {
            attrs: {
                style: 'width: 100%',
                data: this.$props.data,      // JSON.parse(JSON.stringify(this.$props.data)) 
            },
        }, objs);
    },
};

主文件：

testPage.js
import myTable from './myTable';

const tableData = [{
    date: '2016-05-02',
    name: '王小虎',
    address: '上海市普陀区金沙江路 1518 弄'
}, {
    date: '2016-05-04',
    name: '王小虎',
    address: '上海市普陀区金沙江路 1517 弄'
}];

const columns = [{
    label: '日期1',
    prop: 'date',
}, {
    label: '姓名',
    prop: 'name',
    width: 120,
}, {
    label: '住址',
    prop: 'address',
}];

export default {
    template: '<my-table :columns="columns" :data="tableData">',
    data: () => {
        return {
            tableData,
            columns,
        },
    },
    components: {
        myTable
    },
}

What is Expected?

理论上不应该执行2次，使用其它组件不会有这样的问题（比如 el-button）

What is actually happening?

在调用 el-table 时如果没有使用 render() 输出 console.log() 时是不会察觉的被执行2次的，使用 render() 方法后可以察觉出来，所以怀疑是 el-table 有bug会迫使父组件重新渲染一次。

另：封装的这个组件是参考 https://ant.design/components/table-cn/ 做的，感觉使用起来会更简单些，如果可以希望官方能考虑加入 columns 的参数。

[element-bot]

Translation of this issue:

Element UI version

2.0.2

OS/Browsers version

MacOS 10.13.1 / Chrome 63.0.3239.30

Vue version

2.5.2

Reproduction Link

https://jsfiddle.net/pj71jkyw/691/

Steps to reproduce

My real code is the el-table package into a sub assembly, is found to be 2 times as follows:

/ / myTable.js

Export default {
Props: ['columns','data'],

Render: function (H) {
Console.log ('render....... ");

Console.error (New Error ());
Let objs = [];

This.$props.columns.forEach ((item) = > {
Let attrs = JSON.parse (JSON.stringify (item));

Objs.push (H ('el-table-column', {attrs:, attrs}));
});

Return H ('el-table', {)
Attrs: {

Style:'width: 100%',
Data: this.$props.data / / JSON.parse (JSON.stringify (this.$props.data))

},
}, objs);

},
};

.
Master file:

```typescript
TestPage.js

Import myTable from'./myTable';
Const tableData = [{

Date:'2016-05-02',
Name: 'King Tiger',

Address: 'Shanghai city Putuo District Jinsha River road 1518 lane'
{}.

Date:'2016-05-04',
Name: 'King Tiger',

Address: 'Shanghai city Putuo District Jinsha River road 1517 lane'
}];

Const columns = [{
Label: 'date 1',

Prop:'date',
{}.

Label: 'name',
Prop:'name',

Width: 120,
{}.

Label: 'address',
Prop:'address',

}];
Export default {

Template:'<my-table: columns= "columns" data= "tableData"',
(data:) = > {

Return {
TableData,

Columns,
},

},
Components: {

MyTable
},

}
.

### What is Expected?
Theory should not be executed 2 times, the use of other components do not have this problem (such as el-button)

### What is actually happening?
The call to el-table without the use of render (console.log) output () is not aware of being executed 2 times, using the render () method can be identified, so el-table is suspected bug will force the re rendering of a parent component.

Another: the package of this component is reference https://ant.design/components/table-cn/ do, the feeling will be easier to use, if you can hope that the official can consider adding columns parameters.