Question

我正在尝试在VUEJS中进行调查，我使用引导台Vue使其变得更好，因为我试图制作一个Caroussel，一次只能显示一个问题，请您告诉我为什么我可以在我的第一个Caroussel页面中选择收音机但另一方面我试图添加名称和标签，这意味着有无线电组，但这些都不起作用

<template class="bg-light">
  <b-col offset-lg="3" lg="6" sm="12">
    <b-form>
      <b-carousel
        id="carousel-1"
        v-model="slide"
        :interval="0"
        controls
        indicators
        background="#ababab"
        min-height="500px"
      >
        <b-carousel-slide v-for="q in questions" v-bind:key="q.questionid" >
          <template v-slot:img>
            <b-card class="border-warning bg-dark text-light" style="min-height: 500px">
              <b-card-header class="bg-warning text-dark">{{q.question}}</b-card-header>
              <b-card-body>
                <b-form-radio-group->
                  <br/>
                  <b-radio :id="q.rep1.id" :name="q.questionid" :value="q.rep1.id"><label :for="q.rep1.id">{{q.rep1.text}}</label></b-radio><br/><br/><br/>
                  <b-radio :id="q.rep2.id" :name="q.questionid" :value="q.rep2.id"><label :for="q.rep2.id">{{q.rep2.text}}</label></b-radio><br/><br/><br/>
                  <b-radio :id="q.rep3.id" :name="q.questionid" :value="q.rep3.id"><label :for="q.rep3.id">{{q.rep3.text}}</label></b-radio><br/><br/><br/>
                  <b-radio :id="q.rep4.id" :name="q.questionid" :value="q.rep4.id"><label :for="q.rep4.id"> {{q.rep4.text}} </label> </b-radio><br/><br/><br/>
                </b-form-radio-group-><br/>
              </b-card-body>
            </b-card>
          </template>
        </b-carousel-slide>
      </b-carousel>
      <b-button type="submit" variant="info" @click="calcres">Finir le questionnaire</b-button>
    </b-form>
  </b-col>
</template>

<script>
export default {
  name: 'Question',
  props: {
    questions: Array
  },
  methods: {
    calcres: function () {
      var idUpadte = this.$route.params.idUpdate
      this.$db.get(idUpadte)
        .then(doc => {
          this.$db.put({
            _id: 'test',
            _rev: doc._rev
          })
        })
        .catch(err => {
          if (err.message === 'missing') {
            this.$db.put({
              _id: 'test'
              // ajout resultat
            })
              .then(() => {
                alert('Vos réponses ont été enregistrées')
              })
              .catch(() => {
                alert("Erreur lors de l'envoi des réponses")
              })
          }
        })
    }
  }
}

</script>

<style scoped>

</style>

为什么我不能按VueJS中的单选按钮？

0 个答案: