Question

我遵循提供的示例 https://www.ag-grid.com/javascript-grid-filter-text

，但该文本框未出现在我的ag-grid中。我在Vue中使用ag-grid。模板中的代码为：

<DataGrid
    AutoGenerateColumns="False"
    ItemsSource="{Binding Rows}">
    <DataGrid.Columns>
        <DataGridTextColumn Header="[some_field]" Binding="{Binding Path=some_field}" />
        <DataGridTextColumn Header="[some_other_field]" Binding="{Binding Path=some_other_field}" />
    </DataGrid.Columns>
</DataGrid>

数据部分是：

<ag-grid-vue id="myGrid" style="width: 1140px; height:500px"
    rowHeight = 65
    class="ag-theme-balham"
    :columnDefs="columnDefs"
    :rowData="rowData"
    :enableSorting="true"
    :enableFilter="true"
    :pagination="true"
    :paginationPageSize="10"
    :gridReady="onGridReady"
     >
 </ag-grid-vue>

方法是：

data() {
            return {
                columnDefs: null,
                rowData: null,
                gridApi: null,
                columnApi: null,
            }
}

然后我尝试将其捕获在手表中

onGridReady(params) {
                this.gridApi = params.api;
                this.columnApi = params.columnApi;
            },

            myComparator (filter, value, filterText){
                let filterTextLoweCase = filterText.toLowerCase();
                let valueLowerCase = value.toString().toLowerCase();
                switch (filter) {
                    case 'contains':
                        return valueLowerCase.indexOf(filterTextLoweCase) >= 0;
                    case 'notContains':
                        return valueLowerCase.indexOf(filterTextLoweCase) === -1;
                    case 'equals':
                        return valueLowerCase === filterTextLoweCase;
                    case 'notEqual':
                        return valueLowerCase != filterTextLoweCase;
                    case 'startsWith':
                        return valueLowerCase.indexOf(filterTextLoweCase) === 0;
                    case 'endsWith':
                        var index = valueLowerCase.lastIndexOf(filterTextLoweCase);
                        return index >= 0 && index === (valueLowerCase.length - filterTextLoweCase.length);
                    default:
                        // should never happen
                        console.warn('invalid filter type ' + filter);
                        return false;
                }
            },

我有两个问题： 1）文本框过滤器不会消失 2）手表无法正常工作，我不知道在文本框中输入文字后应该如何刷新ag-Grid

有人可以帮助我吗？谢谢

自定义过滤器文本框无法显示，并且可以在ag-Grid中使用

0 个答案: