[Vuejs]-How to use axios get call to dispatch the response vuejs

by

0👍

✅

First of all, keep in mind, this kind of nested data that you dealing with is not a proper approach for transmitting data and you should consider breaking it into little pieces.

Also, there was some typo in your provided data that I manage to fix them out. In order to get the questionId from your provided data, you should define the nested loop as follows:

const allQuestionsIds = [];

const currentSurveys = [{
  id: 1,
  survey_title: "questionnaire TIC TAC",
  company: {
    companyId: 1,
    company_type: "TPE",
    models: [{
      modelId: 1,
      model_title: "Questionnaire TPE",
      topics: [{
          topicId: 1,
          topic_title: "Sécurité des systèmes d'informations",

          questions: [{
              questionId: 1,
              question_title: "Avez-vous, un jour, procédé à un audit de sécurité du système d'information de votre entreprise par une entreprise externe ?",
              answers: [{
                  answerId: 1,
                  answer_title: "Inconnu"
                },
                {
                  answerId: 2,
                  answer_title: "Non"
                },
                {
                  answerId: 3,
                  answer_title: "Une fois"
                },
                {
                  answerId: 4,
                  answer_title: "Récemment"
                },
                {
                  answerId: 5,
                  answer_title: "Régulièrement"
                }
              ]
            },
            {
              questionId: 2,
              question_title: "Avez-vous procédé à un inventaire des OS & logiciels, installés sur le matériel fixe et portable de l'entreprise ?",
              answers: [{
                  answerId: 1,
                  answer_title: "Inconnu"
                },
                {
                  answerId: 2,
                  answer_title: "Non"
                },
                {
                  answerId: 5,
                  answer_title: "Régulièrement"
                },
                {
                  answerId: 6,
                  answer_title: "Occasionnellement"
                },
                {
                  answerId: 11,
                  answer_title: "Peu"
                }
              ]
            }
          ]
        },
        {
          topicId: 2,
          topic_title: "Sécurité du réseau",
          topic_max_quote: 16,
          questions: [{
              questionId: 10,
              question_title: "Présence d'un pare-feu ?",
              answers: [{
                  answerId: 1,
                  answer_title: "Inconnu"
                },
                {
                  answerId: 2,
                  answer_title: "Non"
                },
                {
                  answerId: 18,
                  answer_title: "Oui mais il n'est pas mis à jour"
                },
                {
                  answerId: 19,
                  answer_title: "Oui mis à jour régulièrement"
                }
              ]
            },
            {
              questionId: 11,
              question_title: "Les appareils importants sont-ils reliés à un onduleur ?",
              answers: [{
                  answerId: 1,
                  answer_title: "Inconnu"
                },
                {
                  answerId: 2,
                  answer_title: "Non"
                },
                {
                  answerId: 20,
                  answer_title: "En partie"
                },
                {
                  answerId: 21,
                  answer_title: "Oui"
                }
              ]
            }
          ]
        }
      ]
    }]
  }
}];

currentSurveys.forEach((item) => { // currentSurveys should be your response.data which is this.currentSurveys in your case
  item.company.models.forEach((model) => {
    model.topics.forEach((topic) => {
      topic.questions.forEach((question) => {
        allQuestionsIds.push(question.questionId); // allQuestionsIds should be replace with this.allQuestionsIds in your Vue application
      });
    });
  });
});

console.log(allQuestionsIds);

NOTE: I just defined allQuestionsIds and currentSurveys as consts to provide a live demo, you should skip their variable declarations and then replace allQuestionsIds.push(newThirdItem.questionId); with this.allQuestionsIds.push(newThirdItem.questionId); and also replace currentSurveys with this.currentSurveys in your Vue application.

Leave a comment