做一个考试系统,单选题都是后台来的数据,所以一时间没有想到 @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>

vue--获取监听获取radius的改变的更多相关文章

  1. linux: 获取监听指定端口的进程PID

    在 linux 下经常需要杀死(重启)监听某端口的进程, 因此就写了一个小脚本, 通过 ss 命令获取监听制定端口的进程 PID, 然后通过 kill 命令结束掉进程: #!/bin/sh # set ...

  2. Android修行之路------List view无法获取监听方法

    注意: 1.在list view自定义布局中如果添加滚动布局,会导致自定义布局无法获取监听. 2.如果ListView的每项布局里有像Button,ImageButton之类View的控键时,这些Vi ...

  3. vue学习-day05 -- 案例:名字合并(监听data数据的改变)

    1.案例:名字合并(监听data数据的改变) 使用keyup事件监听data数据的改变 <!DOCTYPE html> <html> <head> <titl ...

  4. Android 监听ContentProvider的数据改变

    今天介绍一下怎么监听ContentProvider的数据改变,主要的方法是:getContext().getContentResolver().notifyChange(uri,null),这行代码是 ...

  5. 时时监听input内容的改变

    心得:我们都知道input有一个change事件,但是是在input元素失去焦点的时候发生,不能时时的监听input内容的改变. 刚开始的时候我是想用setInterval设置计时器的原理定时监听in ...

  6. vue 中监听窗口发生变化,触发监听事件, window.onresize && window.addEventListener('resize',fn) ,window.onresize无效的处理方式

    // 开始这样写,不执行 window.onresize = function() { console.log('窗口发生变化') } // 改成window监听事件 window.addEventL ...

  7. 设计模式(5): vue 不监听绑定的变量

    概述 最近最近做项目的时候总会思考一些大的应用设计模式相关的问题,我把自己的思考记录下来,供以后开发时参考,相信对其他人也有用. 绑定变量 一般情况下,如果我们需要在组件中使用某个变量,会这么使用: ...

  8. 9.Vue.js 监听属性

    本章节,我们将为大家介绍 Vue.js 监听属性 watch,我们可以通过 watch 来响应数据的变化. 以下实例通过使用 watch 实现计数器: <div id = "app&q ...

  9. vue时时监听input输入框中 输入内容 写法

    Vue input 监听 使用 v-on:input="change" 实现即可 App.vue <template> <div> <md-field ...

  10. Vue 事件监听实现导航栏吸顶效果(页面滚动后定位)

    Vue 事件监听实现导航栏吸顶效果(页面滚动后定位) Howie126313 关注 2017.11.19 15:05* 字数 100 阅读 3154评论 0喜欢 0 所说的吸顶效果就是在页面没有滑动之 ...

随机推荐

  1. …gen already exists but is not a source folder. Convert to a source folder or rename it [closed]

    Right click on the project and go to "Properties" Select "Java Build Path" on th ...

  2. 纯CSS制作的TAB选项卡

    代码 这里主要使用表单的单选按钮来实现这个TAB显示和隐藏,首页tab里的内容默认隐藏,如果单选按钮为选中状态(checked)就显示内容.具体请看下面代码. 关于兼容性,因为是用CSS3来制作的,所 ...

  3. Oracle创建directory

    Oracle创建directory   一般创建directory都是为了用数据泵导入/导出数据用,其实directory还有很多别的用处,本文不做阐述   1.新建directory的语法 CREA ...

  4. python登录网易163邮箱,爬取邮件

    from common import MyRequests,LoggerUntil,handle_exception myRequests.update_headers({ 'Accept':'tex ...

  5. [转]总结使用Unity 3D优化游戏运行性能的经验

    转载自:http://www.gameres.com/msg_221889.html 作者:Amir Fasshihi 流畅的游戏玩法来自流畅的帧率,而我们即将推出的动作平台游戏<Shadow ...

  6. Hibernate_day01讲义_使用Hibernate完成对CRM系统中客户管理的DAO中的CRUD的操作

  7. Go面向对象(三)

    go语言中的大多数类型都是值予以,并且都可以包含对应的操作方法,在需要的时候你可以给任意类型增加新方法.二在实现某个接口时,无需从该接口集成,只需要实现该接口要求的所有方法即可.任何类型都可以被any ...

  8. 如何使用Web Service新建和更新Wiki页面的内容

    公司内部有很多部门都创建了Wiki库,来做知识共享.公司是Hosting的SharePoint环境,不能写服务器端代码,要操作Wiki只能通过Web Service来完成,所以,碰到两个情况: 1)W ...

  9. 【django】Error: [WinError 10013] 以一种访问权限不允许的方式做了一个访问套接字的尝试。

    问题描述:启动django服务时出现“Error: [WinError 10013] 以一种访问权限不允许的方式做了一个访问套接字的尝试.”的错误 问题原因:8000端口被占用了 解决办法:默认启动的 ...

  10. springboot 集成elasticsearch

    In this article, we will discuss about “How to create a Spring Boot + Spring Data + Elasticsearch Ex ...