How to conditional hide and show for Vue for loop

dynamic-for-loop.js

<template>
   <section>
      <div class="field" v-for="q in questions">
          <div class="wrap" v-if="q.type === "q"">
            <label>{{q.name}}</label>
            <select @change="onChange($event)">
               <option 
                  :key="a.value" 
                  :value="a.text"
                  v-for="a in q.answer">
               </option>
            </select>
          </div>
          <div class="wrap" v-if="q.type === "a" && show">
            <label>{{q.name}}</label>
            <select>
               <option 
                  :key="a.value" 
                  :value="a.text"
                  v-for="a in q.answer">
               </option>
            </select>
          </div>          
      </div>
   </section>
</template>
...
data() {
  name: '',
  show: false,
  questions: []
},
mounted() {
  this.loadQuestions();
},
methods: {
  loadQuestions() {
     return [
       {
         name: "Needs roof repair?",
         value: "needs_roof_repair",
         type: "q",
         answer: [
            {
              "text": "No",
              "value": "no"
            },            
            {
              "text": "Yes",
              "value": "yes"
            }            
         ]
       },
       {
         name: "Select roof repair needed",
         value: "needed_roof_repair",
         type: "a",
         answer: [
            {
              "text": "Gutter repair",
              "value": "roof"
            },
            {
              "text": "Downspout repair",
              "value": "downspout"
            }            
         ]
       },
       {
         name: "Needs flooring repair?",
         value: "needs_floor_repair",
         type: "q",
         answer: [
            {
              "text": "No",
              "value": "no"
            },            
            {
              "text": "Yes",
              "value": "yes"
            }
         ]
       },
       {
         name: "Select flooring repair needed",
         value: "needed_floring_repair",
         type: "a",
         answer: [
            {
              "text": "Tiles",
              "value": "tiles"
            },
            {
              "text": "Carpet",
              "value": "carpet"
            }            
         ]
       }       
     ];
  },
  onChange(event) {
  
      // If we dynamic set this to TRUE OR FALSE, all other dropdowns will show (including flooring repair options).
      // How do I make that if I choose only the "Needs roof repair" question,
      // only the "Select roof repair needed" will show?
      if(event === "yes") {
         this.show = true;
      } else {
         this.show = false;
      }
  }
}

https://codepen.io/edward1995/pen/xyPNMp

// You can reorganize your data "questions" such that questions will have subquestions.

{
     name: "Needs roof repair?",
     value: "needs_roof_repair",
     type: "q",
     subquestions: [
       {
         name: "Select roof repair needed",
         value: "needed_roof_repair",
         type: "a",
         answer: [
            {
              "text": "Gutter repair",
              "value": "roof"
            },
            {
              "text": "Downspout repair",
              "value": "downspout"
            }            
         ]
       },
     ],
     showSubquestions: false,
     answer: [
        {
          "text": "Yes",
          "value": "yes"
        },
        {
          "text": "No",
          "value": "no"
        }            
     ]
    },

// Then you can update your template:

    <template>
       <section>
          <div class="field" v-for="q in questions">
              <div class="wrap" v-if="q.type === "q"">
                <label>{{q.name}}</label>
                <select @change="onChange($event)"> <!-- you can toggle the showSubquestions in this event -->
                   <option 
                      :key="a.value" 
                      :value="a.text"
                      v-for="a in q.answer">
                   </option>
                </select>
              </div>
              <template v-show="q.showSubquestions">
                <div class="wrap" v-for="subq in q.subquestions">
                  <label>{{subq.name}}</label>
                  <select>
                     <option 
                        :key="subq.value" 
                        :value="subq.text"
                        v-for="subqAnswer in subq.answer">
                     </option>
                  </select>
                </div>          
              </template>
          </div>
       </section>
    </template>