Verfügt Vue.js über eine integrierte Methode, um einem wiederholten Array eine Kopie eines beständigen Objekts hinzuzufügen?

Ich habe eine Vue.js-App, in der ich eine V-Wiederholung für eine Reihe von Elementen habe. Ich möchte der Liste der Elemente ein neues Element hinzufügen. Wenn ich es versuchethis.items.push(this.newItem) Das gepushte Objekt ist weiterhin an die Eingabe gebunden. Betrachten Sie das Folgende:

new Vue({
  el: '#demo',

  data: {
    items: [
      {
        start: '12:15',
        end: '13:15',
        name: 'Whatch Vue.js Laracast',
        description: 'Watched the Laracast series on Vue.js',
        tags: ['learning', 'Vue.js', 'Laracast', 'PHP'],
        note: "Vue.js is really awesome. Thanks Evan You!!!"
      },
      {
        start: '13:15',
        end: '13:30',
        name: "Rubik's Cube",
        description: "Play with my Rubik's Cube",
        tags: ['Logic', 'Puzzle', "Rubik's Cube"],
        note: "Learned a new algorithm."
      }
    ],
    newItem: {start: '', end: '', name: '', description: '', tags: '', note: ''}
  },

  methods: {
    addItem: function(e) {
      e.preventDefault();

      this.items.push(this.newItem);
    }
  }
});

Der obige Befehl verschiebt das Objekt, das an das Array items gebunden ist, wie erwartet. Das Problem ist, dass ich nur eine Kopie des Objekts haben möchte, damit es sich nicht mehr ändert, wenn sich die Eingabe ändert. Sieh dir das andiese Geige. Ich weiß, dass ich es kann:

addItem: function(e) {
  e.preventDefault();
  this.items.push({
    name:        this.newItem.name,
    start:       this.newItem.start,
    end:         this.newItem.end,
    description: this.newItem.description,
    tags:        this.newItem.tags,
    notes:       this.newItem.notes
  })
}

Das funktionier aber es ist viel Wiederholung.

Die Frage Gibt es eine integrierte Möglichkeit, nur eine Kopie des Objekts anstelle des persistenten Objekts hinzuzufügen?

Antworten auf die Frage(6)

Ihre Antwort auf die Frage