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>
vue--获取监听获取radius的改变的更多相关文章
- linux: 获取监听指定端口的进程PID
在 linux 下经常需要杀死(重启)监听某端口的进程, 因此就写了一个小脚本, 通过 ss 命令获取监听制定端口的进程 PID, 然后通过 kill 命令结束掉进程: #!/bin/sh # set ...
- Android修行之路------List view无法获取监听方法
注意: 1.在list view自定义布局中如果添加滚动布局,会导致自定义布局无法获取监听. 2.如果ListView的每项布局里有像Button,ImageButton之类View的控键时,这些Vi ...
- vue学习-day05 -- 案例:名字合并(监听data数据的改变)
1.案例:名字合并(监听data数据的改变) 使用keyup事件监听data数据的改变 <!DOCTYPE html> <html> <head> <titl ...
- Android 监听ContentProvider的数据改变
今天介绍一下怎么监听ContentProvider的数据改变,主要的方法是:getContext().getContentResolver().notifyChange(uri,null),这行代码是 ...
- 时时监听input内容的改变
心得:我们都知道input有一个change事件,但是是在input元素失去焦点的时候发生,不能时时的监听input内容的改变. 刚开始的时候我是想用setInterval设置计时器的原理定时监听in ...
- vue 中监听窗口发生变化,触发监听事件, window.onresize && window.addEventListener('resize',fn) ,window.onresize无效的处理方式
// 开始这样写,不执行 window.onresize = function() { console.log('窗口发生变化') } // 改成window监听事件 window.addEventL ...
- 设计模式(5): vue 不监听绑定的变量
概述 最近最近做项目的时候总会思考一些大的应用设计模式相关的问题,我把自己的思考记录下来,供以后开发时参考,相信对其他人也有用. 绑定变量 一般情况下,如果我们需要在组件中使用某个变量,会这么使用: ...
- 9.Vue.js 监听属性
本章节,我们将为大家介绍 Vue.js 监听属性 watch,我们可以通过 watch 来响应数据的变化. 以下实例通过使用 watch 实现计数器: <div id = "app&q ...
- vue时时监听input输入框中 输入内容 写法
Vue input 监听 使用 v-on:input="change" 实现即可 App.vue <template> <div> <md-field ...
- Vue 事件监听实现导航栏吸顶效果(页面滚动后定位)
Vue 事件监听实现导航栏吸顶效果(页面滚动后定位) Howie126313 关注 2017.11.19 15:05* 字数 100 阅读 3154评论 0喜欢 0 所说的吸顶效果就是在页面没有滑动之 ...
随机推荐
- [转载]Android 生成keystore,两种方式
Refer : http://blog.csdn.net/ms03001620/article/details/8490314 一.eclipse 中生成android keystore 建立任意一个 ...
- Openlayers 3计算长度和面积
1.比较粗糙的计算方式 计算长度 var length = lineFeature.getGeometry().getLength(); if (length > 1000) { length ...
- Go中error类型的nil值和nil
https://my.oschina.net/chai2010/blog/117923
- HTML5 标准规范完成了
万维网联盟(W3C)昨天宣布,HTML5 标准规范终于最终制定完成了,并已公开发布.对于前端工程师来说,这无疑是一个振奋人心的好消息. 众所周知,HTML5改变了互联网,将成为 ...
- Java -- 异常的捕获及处理 -- Exception类与RuntimeException类
7.3 Exception类与RuntimeException类 Exception类与RuntimeException类的联系与区别??? 例:字符串变为整型 Class : RuntimeExce ...
- 8 -- 深入使用Spring -- 7... Spring 整合 Struts 2
8.7 Spring 整合 Struts2 8.7.1 启动Spring 容器 8.7.2 MVC框架与Spring整合的思考 8.7.3 让Spring管理控制器 8.7.4 使用自动装配
- vuejs使用FormData对象,ajax上传图片文件
我相信很多使用vuejs的朋友,都有采用ajax上传图片的需求,因为前后端分离后,我们希望都能用ajax来解决数据问题,传统的表单提交会导致提交成功后页面跳转,而使用ajax能够无刷新上传图片等文件. ...
- 说说UART(转)
串口协议基础 1 串口概述 串口由收发器组成.发送器是通过TxD引脚发送串行数据,接收器是通过RxD引脚接收串行数据.发送器和接收器都利用了一个移位寄存器,这个移位寄存器可以将数据进行“并转串”和“串 ...
- eclipse cdt运行c程序报错“launch failed,binary not found”
1. 安装了eclipsecdt版 2. 采用mingw 编译第一个c程序,报错“launch failed,binary not found”.检查是mingw下的bin目录在环境变量里设置错了. ...
- J2EE学习篇之--Struts1详解
今天来看一下Struts1的相关知识,其实Struts现在是出名的,每个Web开发者都会知道的,也是现在比较流行的框架,下面就来看一下我们为什么要用Struts框架呢? 摘要 1.建立在mvc这种好的 ...