Бесконечное обновление компонента Vue.js

У меня в учебном проекте на Vue.js (, Vuex) есть предупреждение о бесконечной петле обновления компонента (и он действительно обновляется много раз), но я не могу понять откуда растут ноги у этой ошибки. Из-за чего происходит? Ошибка происходит после нажатия на чек боксы сверху (обновление: и без чек боксов тоже).

Компонент в котором происходит зацикливание выводится так:

<MovieCardList 
  v-else
  :movies="filteredMovies"
/>
</div>

Событие чекбокса обновляет состояние хранилища так:

TOGGLE_SORTER_STATE: (state, name) => {
state.filteredMovies.sorters.forEach(
    (sorter) => {
        sorter.on = name === sorter.name? !sorter.on:false;
    }
  );
}

Здесь я использую самописный класс DataProvider, инициализация которого выглядит так:

state.filteredMovies = new DataProvider(
    {
        data: [...movies],
        sorters: [
                   {
                      name: 'Отсортировать по названию',
                      on: false,
                      sorter: (movie1, movie2) => {
                                return movie1.title === movie2.title? 0 : movie1.title < movie2.title? -1 : 1;
                              }
                    },
                    {
                      name: 'Отсортировать по году',
                      on: false,
                      sorter: (movie1, movie2) => {
                                return movie1.year === movie2.year? 0 : movie1.year < movie2.year? -1 : 1;
                              }
                    }
               ]
    }
)

DataProvider имеет итератор, который проходится по массиву в поле data (точнее по его фильтрованной копии). Соответственно, через итератор происходит и отрисовка в компоненте.

Код итератора:

// Iterator
[Symbol.iterator](){
    this.filteredData = [...this.data];
    if(this.sorters){
        this.sorters.forEach(
                (sorter) => {
                    if(sorter.on){
                        this.filteredData.sort(sorter.sorter)
                }
            }
        );
    }
    let current = this.filteredData[Symbol.iterator]();
    const iterator = {
        next(){
            let next = current.next()
            if(next.done){
                return {
                    done: true
                }
            }else{
                return {
                    done: false,
                    value: next.value
                }
            }
        }
    }
    return iterator;
}

Оказалось дело в использовании sort и filter внутри итератора. Только не могу понять почему и как это исправить...