Magento2 Grid表格UI组件2

在这篇博客中，我们将看到更多网格辅助ui组件到我们的网格。

其次组件为我们之前创建的网格添加了更多功能。

Export Button

<container name="listing_top">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="template" xsi:type="string">ui/grid/toolbar</item>
        </item>
    </argument>
    <exportButton name="export_button">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="selectProvider" xsi:type="string">hello_world_grid.hello_world_grid.hello_world_columns.ids</item>
            </item>
        </argument>
    </exportButton>
</container>

下面所有的xml标签都在'container标签内

Bookmark

<bookmark name="bookmarks">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="storageConfig" xsi:type="array">
                <item name="namespace" xsi:type="string">hello_world_grid</item>
            </item>
        </item>
    </argument>
 </bookmark>

Searching

<filterSearch name="fulltext">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="provider" xsi:type="string">hello_world_grid.magease_hello_grid_data_source</item>
            <item name="chipsProvider" xsi:type="string">hello_world_grid.hello_world_grid.listing_top.listing_filters_chips</item>
            <item name="storageConfig" xsi:type="array">
                <item name="provider" xsi:type="string">hello_world_grid.hello_world_grid.listing_top.bookmarks</item>
                <item name="namespace" xsi:type="string">current.search</item>
            </item>
        </item>
    </argument>
</filterSearch>
<filters name="listing_filters">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="columnsProvider" xsi:type="string">hello_world_grid.hello_world_grid.hello_world_columns</item>
            <item name="storageConfig" xsi:type="array">
                <item name="provider" xsi:type="string">hello_world_grid.hello_world_grid.listing_top.bookmarks</item>
                <item name="namespace" xsi:type="string">current.filters</item>
            </item>
            <item name="childDefaults" xsi:type="array">
                <item name="provider" xsi:type="string">hello_world_grid.hello_world_grid.listing_top.listing_filters</item>
                <item name="imports" xsi:type="array">
                    <item name="visible" xsi:type="string">hello_world_grid.hello_world_grid.hello_world_columns.${ $.index }:visible</item>
                </item>
            </item>
        </item>
    </argument>
</filters>

Column Controls

<component name="columns_controls">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="columnsData" xsi:type="array">
                <item name="provider" xsi:type="string">hello_world_grid.hello_world_grid.hello_world_columns</item>
            </item>
            <item name="component" xsi:type="string">Magento_Ui/js/grid/controls/columns</item>
            <item name="displayArea" xsi:type="string">dataGridActions</item>
        </item>
    </argument>
</component>

Paging

<paging name="listing_paging">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="storageConfig" xsi:type="array">
                <item name="provider" xsi:type="string">hello_world_grid.hello_world_grid.listing_top.bookmarks</item>
                <item name="namespace" xsi:type="string">current.paging</item>
            </item>
            <item name="selectProvider" xsi:type="string">hello_world_grid.hello_world_grid.hello_world_columns.ids</item>
        </item>
    </argument>
</paging>

Mass Action

<massaction name="listing_massaction">
    <argument name="data" xsi:type="array">
        <item name="config" xsi:type="array">
            <item name="selectProvider" xsi:type="string">hello_world_grid.hello_world_grid.hello_world_columns.ids</item>
            <item name="indexField" xsi:type="string">entity_id</item>
        </item>
    </argument>
    <action name="delete">
        <argument name="data" xsi:type="array">
            <item name="config" xsi:type="array">
                <item name="type" xsi:type="string">delete</item>
                <item name="label" xsi:type="string" translate="true">Delete</item>
                <item name="url" xsi:type="url" path="hello/world/massDelete"/>
            </item>
        </argument>
    </action>
</massaction>