vue2.0获取自定义属性的值


Posted in Javascript onMarch 28, 2017

最近在项目中使用了vue.js。在爬坑的路上遇到了很多问题。这里都会给记录下来,今天要说的是怎么获取自定义属性的值。

HTML

<!DOCTYPE html>
<html>
<head>
<script src="http://vuejs.org/js/vue.js"></script>
 <meta charset="utf-8">
 <title>JS Bin</title>
</head>
<body>
 <div id="app">
 <button v-for="list in items" @click="getType(list.type)" :type="list.type">click{{list.type}}</button>
 
 <p>type:{{type}}</p>
 
 </div>
 

</body>
</html>

Javascript

var vm = new Vue({
 el:'#app',
 data:{
 type:'',
 items:[
  {type:1},
  {type:2}
 ]
 },
 methods:{
 getType:function(type){
  this.type = type
 }
 }
})

在线demo:http://js.jirengu.com/wemefivime

本文已被整理到了《Vue.js前端组件学习教程》,欢迎大家学习阅读。

关于vue.js组件的教程,请大家点击专题vue.js组件学习教程进行学习。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript firefox兼容ie的dom方法脚本
May 18 Javascript
JS OOP包机制,类创建的方法定义
Nov 02 Javascript
学习并汇集javascript匿名函数
Nov 25 Javascript
firefox浏览器不支持innerText的解决方法
Aug 07 Javascript
JS动态添加iframe的代码
Sep 14 Javascript
jQuery EasyUI Dialog拖不下来如何解决
Sep 28 Javascript
jQuery打字效果实现方法(附demo源码下载)
Dec 18 Javascript
微信小程序-小说阅读小程序实例(demo)
Jan 12 Javascript
layui table数据修改的回显方法
Sep 04 Javascript
微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现
Aug 19 Javascript
关于element-ui表单中限制输入纯数字的解决方式
Sep 08 Javascript
解决新建一个vue项目过程中遇到的问题
Oct 22 Javascript
详解从Node.js的child_process模块来学习父子进程之间的通信
Mar 27 #Javascript
利用NPM淘宝的node.js镜像加速nvm
Mar 27 #Javascript
Vue中的v-cloak使用解读
Mar 27 #Javascript
js实现抽奖效果
Mar 27 #Javascript
AngularJS前端页面操作之用户修改密码功能示例
Mar 27 #Javascript
基于JavaScript实现移动端无限加载分页
Mar 27 #Javascript
JS字符串统计操作示例【遍历,截取,输出,计算】
Mar 27 #Javascript
You might like
浅析php fwrite写入txt文件的时候用 \r\n不能换行的问题
2013/08/06 PHP
php异常处理使用示例
2014/02/25 PHP
PHP中使用file_get_contents抓取网页中文乱码问题解决方法
2014/12/17 PHP
PHP中文竖排转换实现方法
2015/10/23 PHP
PHP中addslashes()和stripslashes()实现字符串转义和还原用法实例
2016/01/07 PHP
Yii中的cookie的发送和读取
2016/07/27 PHP
PHP 等比例缩放图片详解及实例代码
2016/09/18 PHP
Javascript打印网页部分内容的脚本
2008/11/17 Javascript
js parentElement和offsetParent之间的区别
2010/03/23 Javascript
jquery的ajax简单结构示例代码
2014/02/17 Javascript
jQuery实现流动虚线框的方法
2015/01/29 Javascript
浅谈jQuery中的事件
2015/03/23 Javascript
javascript最基本的函数汇总
2015/06/25 Javascript
canvas绘制环形进度条
2017/02/23 Javascript
原生JS 购物车及购物页面的cookie使用方法
2017/08/21 Javascript
[02:11]DOTA2上海特级锦标赛主赛事第二日RECAP
2016/03/04 DOTA
[02:00]DAC2018主宣传片——龙征四海,剑问东方
2018/03/20 DOTA
[02:26]2018DOTA2亚洲邀请赛赛前采访-Newbee篇
2018/04/03 DOTA
python文件和目录操作函数小结
2014/07/11 Python
Cpy和Python的效率对比
2015/03/20 Python
教你用Type Hint提高Python程序开发效率
2016/08/08 Python
python与php实现分割文件代码
2017/03/06 Python
对numpy 数组和矩阵的乘法的进一步理解
2018/04/04 Python
借助Paramiko通过Python实现linux远程登陆及sftp的操作
2020/03/16 Python
Django用户身份验证完成示例代码
2020/04/03 Python
Pygame的程序开始示例代码
2020/05/07 Python
菲律宾最大的网上花店和礼品店:PhilFlower.com
2018/02/09 全球购物
Holiday Inn中国官网:IHG旗下假日酒店预订
2018/04/08 全球购物
俄罗斯达美乐比萨外送服务:Domino’s Pizza
2020/12/18 全球购物
捷克建筑材料网上商店:DEK.cz
2021/03/06 全球购物
计算机应用专业毕业生求职信
2013/10/24 职场文书
募捐倡议书怎么写
2014/05/14 职场文书
党员四风自我剖析材料思想汇报
2014/09/13 职场文书
教师党的群众路线教育实践活动个人整改措施
2014/11/04 职场文书
飞越疯人院观后感
2015/06/09 职场文书
2016年秋季运动会通讯稿
2015/11/25 职场文书