vue--获取监听获取radius的改变

做一个考试系统,单选题都是后台来的数据,所以一时间没有想到 @change这个方法:

<template>
  <div id="Home">    
    <v-header></v-header>
    <hr>
    {{title}}
    <br> 
    <p v-for="(x,k) in radiolist">
      {{k+1}}、{{x.title}}<br>
      <span v-for="(xx,ke) in x.list">{{xx}}<input type="radio" :name="'a'+k" @change="changeInput(k)" /></span>
    </p>
    <hr>
    <div class="isCheck">
      <span v-for="(x,k) in radiolist" v-if="x.isCheck">{{k+1}}</span>
    </div>
  </div>  
</template>
<script>
import Header from './Header.vue'; 
export default {
  name: 'Home',
  data () {
    return {
      title:'todolist',
      todo:'我是一个值',
      list:[],
      radiolist:[
        {
          id:0,
          title:'我是00000',
          list:['A','B','C','D'],
          isCheck:false,
        },
        {
          id:1,
          title:'我是11111',
          list:['A','B','C','D'],
          isCheck:false,
        },
        {
          id:2,
          title:'我是22222',
          list:['A','B','C','D'],
          isCheck:false,
        }
      ],
    }
  },
  methods:{
    changeInput(index){ 
      this.radiolist[index].isCheck = true;
    }
  },
  components:{
    'v-header':Header,
  }
}
</script>
<style>
.isCheck{border:1px solid red;}
.isCheck span{padding:0px 15px; margin-right:5px;}
</style>
原文地址:https://www.cnblogs.com/e0yu/p/9808074.html