Javascript — Laravel VueJs Array’s

Я использую Laravel 5.5 и VueJS для своего приложения.

У меня есть форма на экземпляре vue, которая позволяет пользователю вводить данные о человеке и добавлять их в визит. При добавлении мой метод добавляет детали из входных данных в массив посетителей.

ПРОБЛЕМА: Когда я добавляю посетителя в массив посетителей и нажимаю удалить
это прекрасно работает, когда я импортирую и нажимаю удалить на одном из посетителей
это удаляет не того посетителя.

Мой экземпляр Vue (часть)

data: {
visitor: {},
}

Моя форма

<input v-model="visitor.last" class="input" placeholder="Last Name">
<input v-model="visitor.company" class="input" placeholder="Company">
<input v-model="visitor.email" class="input" placeholder="Email" type="email">
<button class="button is-primary" @click="saveVisitor">Add Visitor</button>

Мой метод

saveVisitor() {
this.visitors.push(this.visitor);
this.visitor = {};
},

Все это прекрасно работает и работает как надо, теперь я добавил еще один метод для заполнения списка посетителей, и это импорт электронных таблиц, который я анализирую в своем бэкэнде Laravel и возвращаю к своему экземпляру Vue.

СПОСОБ РАСПРОСТРАНЕНИЯ

submitImport() {

const vm = this;

var form = new FormData();
form.append('file', document.getElementById('file').files[0]);

axios({
method: 'post',
url: '/import/visitors',
data: form
}).then(function(response){

if(response.status === 200){

vm.visitors = response.data;

} else {

vm.loading = false;

}

});
},

При работе с таблицей я создаю массив в бэкэнде:

Контроллер Laravel (часть)

$visitor[] = array(
'first' => $v->FirstName,
'last' => $v->LastName,
'email' => $v->Email,
'company' => $v->Company
);

После того, как функция закончила цикл по строкам в электронной таблице, мой контроллер возвращает массив обратно в экземпляр vue.

return response($visitor,200);

Я принимаю массив в своем экземпляре Vue и заполняю массив посетителей в моем экземпляре Vue результатами.

vm.visitors = response.data;

И это прекрасно работает! Моя единственная проблема в том, что когда я пытаюсь удалить одного из посетителей из массива vm.visitors, он удаляет неправильный, который, как я предполагаю, связан с ключами.

см. мой метод удаления.

removeVisitor(visitor) {
console.log(visitor);
//this.visitors.splice(visitor,1);
},

Когда я просматриваю консоль, я получаю следующее, обратите внимание, что я добавил некоторые из импорта электронных таблиц, а некоторые через ввод данных формы.

Похоже, массив посетителей в моем экземпляре vue содержит два разных типа данных.

Скриншот моего изображения

Когда вы нажимаете … в верхнем объекте, это возвращает имя и т. Д., Но это отличается от 2-го объекта, который четко содержит данные?

1

Решение

Задача ещё не решена.

Другие решения

Других решений пока нет …

По вопросам рекламы ammmcru@yandex.ru
Adblock
detector