Принимаю json c сервера. в Компонетнт
b-table (bootstrap-vue), который отображает элементы как строки из массива
items
Вместо того чтобы в хранилище массив с корневыми объектами перезаписывался каждый раз, он его добавляет как еще один елемент массива с вложенными обектами, и ещё один, и ещё.. и ещё.. и так далее. каждый раз при переходе.
Нужно чтобы было <b>items</b>[{one}, {two}, {three}]
А он при все равных условиях делает
<b>items</b>[
[{one}, {two}, {three}],
[{one}, {two}, {three}],
[{one}, {two}, {three}]
]
Ранее, делал точно так же, ранее в массив попадали обекты и каждый раз перезаписывались, а теперь почему то при каждом переходе в массиве появляется новый елемент с обектами внутри и
b-table его не видит. Хотя в мутациях он переприсваивается. Куда что смотреть, куда копать?
Есть таблица
<b-table striped="striped" bordered="bordered" responsive="sm"
:items="items" :fields="fields" :current-page="currentPage" :per-page="perPage">
При загрузке компонента выполняю
action fetchSysTax:
mounted() {
this.$store.dispatch('settings/fetchSysTax');
},
Далее уже items получаю из хранилища состояния:
computed: {
items: {
get() {
return this.$store.state.settings.systaxs;
},
},
},
Action -->
fetchSysTax export const fetchSysTax = ({ commit }) => new Promise((resolve, reject) => {
Vue.$http.get('/taxs').then((response) => {
commit(types.FETCH_SYSTAX, response.data);
resolve(response);
}, (err) => {
reject(err);
});
});
Mutation
FETCH_SYSTAX[FETCH_SYSTAX](state, fetchSysTax) {
state.systaxs = fetchSysTax; <-- данные ввиде json
// Vue.set(state.systaxs, fetchSysTax); <-- так тоже самое
// fetchSysTax.forEach((itm) => { <-- и так тоже самое
// state.systaxs.push(itm); <-- и так тоже самое
// });
},
С сервера приходит такие данные
[{"id":1,"name":"asdasd","title":"stand2","perc":34},{"id":2,"name":"213123","title":"213123","perc":1231},{"id":3,"name":"asdasd","title":"asdasd","perc":1011},{"id":4,"name":"qwe","title":"qwe","perc":11},{"id":6,"name":"werwer","title":"werwer","perc":23}]
Хранилище State:
export default {
systaxs: [],
};
На выходе получаю, что в хранилище
systaxs вместо замены всего массива, добавляется следующий элемет с вложенными обектами и b-table его не видит, так как они не корневые. В мутации, я его не пушу (push) а просто присваиваю.
По этому через computed данныек присваиваются не корректно.
Если сделать
mounted() {
this.$store.dispatch('settings/fetchSysTax')
.then((value) => {
this.items = value.data;
});
}
Тогда работает корректно и отображаются данные в таблице ввиде строк, но при этом данные хранилище
systaxs все равно доблавляются, а не заменяются.
Ранее так же делал, все работала, через computed, который срабатывал как только данные появлялись в systaxs, и отображал мне корректный массив в котором каждый элемент был корневым обьектом.