[Vuejs]-Standalone Vue js: pass data to modal component

Where did you use the for-loop in your modal template? I do not see any v-for.

Your should not be inside for loop. I am guessing since you mentioned it prints out many buttons you had that inside the for loop. the v-for should be on the tag like below

<script type="text/x-template" id="modal-template">
            <transition name="modal">
              <div class="modal-mask">
                <div class="modal-wrapper">
                  <div class="modal-container">
                    <div class="modal-header">
                      <slot name="header">
                        select the country you want to support
                      </slot>
                    </div>

                    <div class="modal-body">
                      <slot name="body">
                        <div class="country_select_carousel">
                          <div class="countrySlide">

                           <img v-for="item in country_carousel_data" :src="imgUrl + '/flags/' + item.imgName"> 
                          </div>
                        </div>
                      </slot>
                    </div>

                    <div class="modal-footer">
                      <slot name="footer">
                        <div class="modal-default-button" @click="$emit('close')">
                          confirm
                        </div>
                      </slot>
                    </div>
                  </div>
                </div>
              </div>
            </transition>
          </script>