0
votes

Array affiche uniquement les dernières données de mon tableau et non toutes les données

Je veux boucler les this.results et ajouter afficher les données dans v-calendar, mais à partir de maintenant, il n'affiche que le dernier élément et non toutes les données de mon JSON. mon modèle

this.results.forEach(element => {
    this.events = [
      {
        name: element.name,
        details: element.details,
        start: element.start,
        end: element.end,
        color: "black"
      }
    ];
    console.log(element);
  });

et voici mon script.

REMARQUE : this.results est un JSON et this.events n'est qu'un tableau

<v-calendar
  type="month"
  now="2019-01-08"
  value="2019-01-08"
  :events="events"
></v-calendar>

javascript arrays vue.js

0 commentaires

3 Réponses :

2
votes

Vous devez pousser les éléments dans le tableau this.events : -

this.results.forEach(element => {
    this.events.push({
        name: element.name,
        details: element.details,
        start: element.start,
        end: element.end,
        color: "black"
      });
    console.log(element);
});

0 commentaires

0
votes

Je pense que vous devriez utiliser la méthode map ou la méthode forEach + la méthode push .

this.events = this.results.map(function(element) {
  return {
    name: element.name,
    details: element.details,
    start: element.start,
    end: element.end,
    color: "black"
  };
});
console.log(this, events);

p >

0 commentaires

0
votes

Utilisez la méthode push du tableau pour insérer des données dans le tableau. Actuellement, vous attribuez simplement la valeur à this.events , ce qui vous montre la dernière valeur qui vous a été attribuée.

Voici le code

this.results.forEach(element => {
    this.events.push(
      {
        name: element.name,
        details: element.details,
        start: element.start,
        end: element.end,
        color: "black"
      }
    );
    console.log(element);
  });

p >

0 commentaires