Функциональность позволяет добавлять/удалять описание, название и время события.VueJs Как дублировать объект из v-repeat?
Я не могу справиться с дублированием (клонирование) объекта, который создается с помощью клиновых модели = (event.name, event.description и event.date)
Все отлично работает с удалением выбранного объекта , он работает следующим образом:
deleteEvent: function(index){
if(confirm('Are you sure?')) {
this.events.$remove(index);
}
}
Вот пример моего кода для приложения для добавления и изменения событий.
var vm = new Vue({
el: '#events',
data:{
event: { name:'', description:'', date:'' },
events: []
},
ready: function(){
this.fetchEvents();
},
methods: {
fetchEvents: function() {
var events = [
{
id: 1,
name: 'TIFF',
description: 'Toronto International Film Festival',
date: '2015-09-10'
},
{
id: 2,
name: 'The Martian Premiere',
description: 'The Martian comes to theatres.',
date: '2015-10-02'
},
{
id: 3,
name: 'SXSW',
description: 'Music, film and interactive festival in Austin, TX.',
date: '2016-03-11'
}
];
this.$set('events', events);
},
addEvent: function() {
if(this.event.name) {
this.events.push(this.event);
this.event = { name: '', description: '', date: '' };
}
},
deleteEvent($index)"
deleteEvent: function(index){
if(confirm('Вы точно хотите удалить данную запись?')) {
this.events.$%remove(index);
}
},
cloneItem: function(index) {
}
}
});
есть полный код http://codepen.io/Monocle/pen/ojLYGx
благодарю вас @Ivan. Я нашел немного более элегантное решение, в этом случае не нужно перечислять свойства объекта. 'cloneItem: function (index) {this.events.push (Vue.util.extend ({}, this.events [index])); } ' –
@KirillMonocle: Выглядит лучше. Хотя «недокументированный» звучит так, как будто он может изменить свое поведение в будущих выпусках без предупреждения. –