Yii2.0的GridView使用和原理浅析

一.使用方式：

GridView::widget([
    'layout' => "{items}\n{summary}\n{pager}",//默认是 "{summary}\n{items}\n{pager}"，可供填写的值有summary(总结)， items(内容)，pager(分页)， sorter(排序)【备注6】
    'dataProvider' => $provider,//是一个dataProvider对象，包含多个model对象
    'tableOptions' => [
        'class' => 'table table-striped table-bordered',//这个属性有默认配置，注意自定义时需要添加
        'style' => '',
    ],//table标签的属性配置
    'options' => [
        'class' => 'grid-view',//固有的默认值
        'id' => 'xxxx',//自己指定id，默认是'w0'，【备注1】
    ],
    'formatter' => null/array/Formatter object,//可以为空，则使用Yii的formatter；array则必须包括class字段；也可以直接传一个Formatter对象。【备注2】
    'filterRowOptions' => [
        'class' => 'filters'
    ],//【备注3】

    'showOnEmpty' => true,//【备注5】
    'showHeader' => true,
    'showFooter' => true,//【备注7】
    'columns' => [
        [
            'value' => string/Closure, //model对象的属性或匿名函数，匿名函数的参数是单独的一个model对象
            'label' => string,//每一列的表头
            'contentOptions' => [
                'class' => '',
                'style' => '',
            ],//td标签的属性配置
            'options' => [
                'width' => '10px',
            ],//配置了这个属性，会在table中 生成,如果其他数据列没有配置，则有一占位【备注8】
            'visible' => true,//【备注4】
            //...
        ],//可以是一个数组，也可以是一个字符串，字符串必须是model的字段
    ],
//...
]);

注：必须配置的键是：’dataProvider’，不配置’columns’则默认显示model中的所有字段；columns中每一条建议必须配置的键是’value’

二.原理前析

1.widget方法先通过Yii::createObject()创建一个GridView对象，传入参数的第一维数组，键作为属性，值作为值赋给GridView对象；

2.因为GridView继承自Component类，所创建过程中的构造方法会调用GridView的init()方法。       
    a.GridView的init方法会先调用BaseListView的init方法，给$options['id']赋值，默认是'w0'，有多个则按顺序递增'w1','w2'....，你也可以自己指定(在使用方式的备注1处)
    b.根据formatter属性，设置formatter，备注2处
    c.设置$filterRowOptions['id']的值，默认是$options['id']值后面连接一个'-filter'，即w0-filter。这个也可以自己指定:备注3处
    d.调用initColumns方法，如果没有设置columns，则默认显示model的所有字段；根据columns中的每一arrary/value，创建DataColumn对象，并保存到GridView属性$columns数组中。根据每一个column的visible属性判断是否显示:备注4处

3.调用GridView的run()方法
    a.注册GridViewAsset，绑定yiiGridView方法
    b.调用父类BaseListView的run()方法：
属性showOnEmpty为false(备注5处设置)或dataProvider为空，则渲染空模板
有数据则调用renderSection()方法按layout属性指定的顺序(顺序特别重要，备注6处)分别渲染，{summary}使用renderSummary()方法渲染，{items}使用renderItems()方法渲染，{pager}使用renderPager()方法渲染，{sorter}使用renderSorter方法渲染

4.在4类渲染中，一般我们主要针对表格的样式做一些改动，所以我们重点关注renderItems()方法
    这个方法会渲染一个表格，表格的样式通过$tableOptions配置
表格分为Caption(b标题)，ColumnGroup(列样式)，Header(表头)，Body(内容)，Footer(表尾)；分别调用renderCaption() caption指定显示内容，captionOptions指定样式；
    renderColumnGroup() columns中的每一条中的options指定：备注8处；
    renderTableHeader() headerRowOptions指定行样式，columns中的headerOptions指定列样式；
    renderTableBody() rowOptions指定行样式，columns中的contentOptions指定列样式；
    renderTableFooter() footerRowOptions指定行样式，columns中的footerOptions指定列样式。

5.Header和Footer可以分别通过showHeader，showFooter分别控制是否显示:备注7处