telerik VueJS Ошибка фильтрации сетки - PullRequest
Новая
       30

telerik VueJS Ошибка фильтрации сетки

0 голосов
/ 21 октября 2019

Я пытаюсь внедрить сеточную фильтрацию vuejs и получить следующую ошибку при попытке очистить установленный фильтр: 

   [Vue warn]: Error in v-on handler: "RangeError: invalid array length"

  found in

  ---> <GridFilterCell>
        <FilterRow>
         <HeaderRow>
           <Header>
             <Grid>
               <Reports3> at src/components/Reports3.vue
                 <Target> at src/components/Target.vue
                   <App> at src/App.vue
                     <Root> vue.runtime.esm.js:619


  RangeError: "invalid array length"
     node_modules FilterRow.js:51
     node_modules FilterRow.js:115
     node_modules FilterRow.js:150
    VueJS 4
     node_modules GridFilterCell.js:258
     node_modules GridFilterCell.js:229
     node_modules GridFilterCell.js:164
  VueJS 3
   vue.runtime.esm.js:1888

определение сетки: 

  <Grid :style="{height: '450px'}"
              :data-items="reports"
              :sortable="true"
              :sort="sort"
              :filterable="true"
              :filter="filter"
              :filter-cell-render="filterRender"
              :pageable="true"
              :skip="skip"
              :take="take"
              :total="totalRecords"
              :columns="columns"
              @filterchange="filterChange"
              @sortchange="sortChangeHandler"
              @pagechange="pageChangeHandler">}
  </Grid>

Методы фильтра data (): 

  data(){
    return{
          filter: {
            logic: "and",
            filters: [
               { field: "institutionId", operator: "neq", value: 0 },
               { field: "typeCode", operator: "neq", value: "" },
               { field: "name", operator: "neq", value: "" }
           ]
         },
         filterChange: function (e) {
           this.filter = e.filter;
         },
         filterRender: function (h, defaultRendering, props, change) {
         return defaultRendering;
       }
     }
  }

Это страница документа telerik, которую я использую в качестве ссылки: https://www.telerik.com/kendo-vue-ui/components/grid-native/filtering/

Ответы [ 2 ]

2 голосов
/ 24 октября 2019

Я столкнулся с той же проблемой. Поскольку сетка telerik Vue (нативная) по-прежнему считается бета-версией, я думаю, что есть еще несколько ошибок, подобных этой.

Это обходной путь до исправления командой telerik.

В вашемпапка проекта node_modules @ progress \ kendo-vue-grid \ dist \ es \ header \ FilterRow.js

Найти эту строку:this.$emit.apply(this, __spreadArrays(['filterchange', filtersResult], e));

Заменить на эту строку:this.$emit.apply(this, ['filterchange', filtersResult, e]);

И вы должны быть готовы к работе.

Я думаю, __spreadArrays - это команда TypeScript (3.6) и, возможно, неуместна в FilterRow.js. И, похоже, в этом нет необходимости, поскольку объекты filterchange, filtersResult и e определенно не являются массивами. Вы можете проверить это путем отладки. Помните, что любое обновление версии Telerik Grid заставит вас снова найти и изменить строку кода, пока ошибка не будет устранена.

Надеюсь, это поможет.

1 голос
/ 29 октября 2019

Это была ошибка в Kendo Vue Grid, и исправление этой проблемы было только что выпущено в версии 0.3.7 Kendo Vue Grid. Если вы наблюдаете другие проблемы, пожалуйста, сообщите нам об этом по https://www.telerik.com/support/kendo-ui или зарегистрируйте проблемы в нашем общедоступном репозитории - https://github.com/telerik/kendo-vue.

Привет, Plamen

...