<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="utf-8">

    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

    <title></title>

    <link rel="icon" type="image/ico" href="src/assets/favicon.ico">

    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">

    <script src="src/assets/vue2.min.js"></script>

</head>

<body>

    <a v-for="(index,item) in items" href="http://www.baidu.com" @click="getTarget($event)" data-index="{{index}}">{{$index}}{{item.text}}<br></a>

    <input type="text" id="attr">

</body>

<script>

    new Vue({

        el:'body',

        data:{

            items:[

                {text:'小黄'},

                {text:'小明'},

                {text:'小红'},

                {text:'小蓝'}

            ]

        },

        methods:{

            getTarget:function (ev) {

                ev.preventDefault();//禁止跳转

                let target = event.target;//取当前点击目标

                console.log(target.getAttribute('data-index'));//取当前点击目标的属性

                document.getElementById('attr').value=target.getAttribute('data-index');

            }

        }

    })

</script>

</html>

　　

v-for指令用法二的更多相关文章

  1. 实例演示oracle数据块状态视图v$bh的用法二 热点块问题(转)

    在实例一中,我们读取到了x$bh中的tch字段,该字段表示的该字段被读取/写入的次数,这个值在oracle的LRU算法中,是一个重要的参数,如果这个字段被访问,则该值就会增加: 1,第一次查看TCH的 ...

  2. 学习AngularJs:Directive指令用法（完整版）

    这篇文章主要学习AngularJs:Directive指令用法,内容很全面,感兴趣的小伙伴们可以参考一下   本教程使用AngularJs版本:1.5.3 AngularJs GitHub: http ...

  3. (转)Linux系统stat指令用法

    <Linux系统stat指令用法>  原文:https://www.cnblogs.com/linux-super-meng/p/3812695.html stat指令:文件/文件系统的详 ...

  4. 学习AngularJs:Directive指令用法

    跟我学AngularJs:Directive指令用法解读(上) http://blog.csdn.net/evankaka/article/details/51232895 跟我学AngularJs: ...

  5. react基础用法二(组件渲染)

    react基础用法二(组件渲染) 如图所示组件可以是函数 格式:function 方法名(){ return <标签>内容</标签>} 渲染格式: <方法名 />  ...

  6. [Linux] scp指令用法

    scp 指令用法 # scp usage: scp [-12346BCpqrv] [-c cipher] [-F ssh_config] [-i identity_file] [-l limit] [ ...

  7. Vue中基本指令用法

    指令在Vue中是个很重要的功能,在Vue项目中是必不可少的.根据官网的介绍,指令 (Directives) 是带有 v- 前缀的特殊属性.指令的职责是,当表达式的值改变时,将其产生的连带影响,响应式地 ...

  8. Matlab 常用绘图指令（二维图形）

    使用matlab的时候常常会忘掉一些指令,每次都要重新查找,挺麻烦的,这里收集一些常用的绘图指令,供自己和大家以后方便查找和使用. 1.例子-包含了常用绘图命令 clear clc %%数据准备 x ...

  9. Angular内置指令（二）

    目录: $rootScope,ng-app,.run(),ng-include,ng-repeat,ng-if,ng-switch,ng-init ng-show/ng-hide,ng-model,n ...

随机推荐

  1. MFC office2007风格设置左侧导航栏 [转]

    当基础的框架搭好以后,我想为其添加一个左侧导航栏,过程如下:在框架类的头文件添加一个导航栏参数: CMFCOutlookBar m_navigation; 为了完善功能,在导航栏里面我添加了一个CTr ...

  2. 【iOS开发-58】tableView初识：5个重要方法的使用和2种样式的差别

    创建一个tableView,直接拖拽放在storyboard里面就可以. (1)先创建一个数据模型类WSCarGroup,在WSCarGroup.h文件里: #import <Foundatio ...

  3. 如何直接打开使用locate等查找到的文件

    很多的时候需要使用locate去定位文件,找到了文件之后接下来就是使用相应的文本编辑工具如gvim进行打开. 这个时候最烦心的就是去复制一大长串的地址了. 如果能让定位和打开一体操作就最好了,这就需要 ...

  4. 验证loadrunner对Ajax内容的校验

    前一阵和开发的同事一起測试某个系统的性能.此系统是发送Ajax请求到后台,再调用第三方的某项服务. 第三方服务的性能由不得我们控制.因此开发者做了一下改进.超时则直接返回. 于是在loadrunner ...

  5. web微信开发

    群里接收消息时,使用广播,但需要刷新页面才能接收到广播内容. - 轮询: 定时每秒刷新一次,当群不活跃时,群里的每个客户端都在刷新,对服务端压力太大. - 长轮询:客户端连服务端,服务端一直不断开,也 ...

  6. mysql报错锦集

    MySQL 启动报错 - ERROR 2002 (HY000): Can’t connect to local MySQL server through socket ‘/var/lib/mysql/ ...

  7. Codeforces 490F Treeland Tour 树上的最长上升子序列

    题目链接:点击打开链接 题意: 给定n个点的树. 以下n个数表示点权. 以下n-1行给出树. 找一条链,然后找出这条链中的点权组成的最长上升子序列. 求:最长上升子序列的长度. 思路: 首先是维护一条 ...

  8. Android与服务器端数据交互（基于SOAP协议整合android+webservice）

    http://www.cnblogs.com/zhangdongzi/archive/2011/04/19/2020688.html 上一节中我们通过http协议,采用HttpClient向服务器端a ...

  9. MyBatis学习(二)：与Spring整合（非注解方式配置MyBatis）

    搭建SpringMVC的-->传送门<-- 一.环境搭建: 目录结构: 引用的JAR包: 如果是Maven搭建的话,pom.xml的配置如下: <?xml version=" ...

  10. Web性能测试工具：Siege安装&使用简介

    在Web性能测试工具中,siege是比较热门和常见的,它有安装简单,使用简单,测试报告详细的特点. 并且可以在文本中预定义一系列待测试url模拟,并可设定一定并发量下持续指定时间or测试进行测试. 比 ...