el-grid v1.0.1

Grid 表格

在支持el-table组件已有功能的基础上集成了排序，筛选，分页，请求服务端数据等功能，具有更好的拓展性。

待完成 增加导出功能

参数

用法

基础用法。

在配置data与columns属性后即可正常展示数据

    <template>
        <div>
            <el-grid width="500" :config="tableCfg" :data="data"></el-grid>
        </div>      
    </template>

<script>
    export default {
        data(){
            return{
                data: [
                    {
                        date: '2016-05-02',
                        name: '王小虎',
                        address: '上海市普陀区金沙江路 1518 弄'
                    }, 
                    {
                        date: '2016-05-04',
                        name: '王小虎',
                        address:  '上海市普陀区金沙江路 1517 弄'
                    },
                    {
                        date: '2016-05-03',
                        name: '王小虎',
                        address: '上海市普陀区金沙江路 1516 弄'
                    }
                ],
                tableCfg:{
                    columns:[
                        {
                            prop: 'name',   
                            label: '姓名'
                        },
                        {
                            prop: 'date',  
                            label: '日期'
                        },
                        {
                            prop: 'address',  
                            label: '地址'
                        }
                    ]
                }
            }
        }
    }
</script>

### 加载服务端数据

>需要配置`url`与`mode`属性，`url`表示拉取数据的url地址。
```html
<template>
    <div>
        <el-grid width="500" :config="tableCfg" ></el-grid>
    </div>      
</template>

<script>
    export default {
        data(){
            return{
                tableCfg:{
                    pageSize: 5,
                    mode: 'local',
                    url:'https://easy-mock.com/mock/5cb2c5708185550e7d51c038/example/getList',
                    columns:[
                        {
                            prop: 'name',   
                            label: '姓名'
                        },
                        {
                            prop: 'date',  
                            label: '日期'
                        },
                        {
                            prop: 'address',  
                            label: '地址'
                        }
                    ]
                }
            }
        }
    }
</script>