Проблема возникает из-за неправильной обработки ответа от сервера и присвоения его переменной `this.group`. В текущем коде, вы пытаетесь сохранить в `this.group` всего объект `response`, который содержит много информации включая статус ответа, заголовки и т.д.
Чтобы исправить эту проблему, вам нужно сохранить только нужные данные из ответа. Например, если вы ожидаете список групп, который находится в свойстве `data.groups` в ответе, то вы должны сохранить его следующим образом:
```javascript
this.group = response.data.groups;
```
Кроме того, вы также должны установить флаг `loading` в значение `true` перед отправкой запроса, чтобы показать пользователю, что данные загружаются. Установка значения `false` должна быть внутри колбэка `then`, чтобы гарантировать, что она будет выполнена после получения данных.
Вот исправленный код метода `selectionGroup()`:
```javascript
selectionGroup() {
this.loading = true; // установка флага loading в true перед отправкой запроса
axios.get('/groups.json', {
params: {
location_id: 7
}
}).then(response => {
this.group = response.data.groups; // сохранение только нужной информации в this.group
}).catch(error => {
console.log(error);
}).finally(() => {
this.loading = false; // установка флага loading в false после получения данных
});
},
```
Теперь, при каждом изменении значения в выпадающем списке, метод `selectionGroup()` будет вызываться только один раз, и данные будут правильно отображены.