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 相关文章推荐
一个js拖拽的效果类和dom-drag.js浅析
Jul 17 Javascript
JavaScript高级程序设计阅读笔记(十六) javascript检测浏览器和操作系统-detect.js
Aug 14 Javascript
瀑布流布局代码一例
Apr 11 Javascript
JS 新增Cookie 取cookie值 删除cookie 举例详解
Oct 10 Javascript
javascript通过获取html标签属性class实现多选项卡的方法
Jul 27 Javascript
JavaScript调用传递变量参数的相关问题及解决办法
Nov 01 Javascript
详解Javascript函数声明与递归调用
Oct 22 Javascript
bootstrap fileinput完整实例分享
Nov 08 Javascript
Bootstrap modal 多弹窗之叠加关闭阴影遮罩问题的解决方法
Feb 27 Javascript
jQuery实现网页拼图游戏
Apr 22 jQuery
js+html5 canvas实现ps钢笔抠图
Apr 28 Javascript
JS实现的tab切换并显示相应内容模块功能示例
Aug 03 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完整的日历类(CLASS)
2006/11/27 PHP
PHP 面向对象详解
2012/09/13 PHP
PHP实现数组的笛卡尔积运算示例
2017/12/15 PHP
聊聊 PHP 8 新特性 Attributes
2020/08/19 PHP
JavaScript中Object和Function的关系小结
2009/09/26 Javascript
jQuery实战之品牌展示列表效果
2011/04/10 Javascript
jquery中的mouseleave和mouseout的区别 模仿下拉框效果
2012/02/07 Javascript
Jquery创建层显示标题和内容且随鼠标移动而移动
2014/01/26 Javascript
js实现圆盘记速表
2015/08/03 Javascript
在Web项目中引入Jquery插件报错的完美解决方案(图解)
2016/09/19 Javascript
js实现模糊匹配功能
2017/02/15 Javascript
详解Vue中localstorage和sessionstorage的使用
2017/12/22 Javascript
Vue.js 实现微信公众号菜单编辑器功能(一)
2018/05/08 Javascript
nodeJs爬虫的技术点总结
2018/05/13 NodeJs
ES6 class类链式继承,实例化及react super(props)原理详解
2020/02/15 Javascript
Vue $emit()不能触发父组件方法的原因及解决
2020/07/28 Javascript
构建一个JavaScript插件系统
2020/10/20 Javascript
Python压缩解压缩zip文件及破解zip文件密码的方法
2015/11/04 Python
详解python中字典的循环遍历的两种方式
2017/02/07 Python
Python中对数组集进行按行打乱shuffle的方法
2018/11/08 Python
python3 实现对图片进行局部切割的方法
2018/12/05 Python
Python 中Django安装和使用教程详解
2019/07/03 Python
Pytorch技巧:DataLoader的collate_fn参数使用详解
2020/01/08 Python
Python如何实现的二分查找算法
2020/05/27 Python
重构Python代码的六个实例
2020/11/25 Python
澳大利亚最超值的自行车之家:Reid Cycles
2019/03/24 全球购物
财务会计人员岗位职责
2013/11/30 职场文书
给老婆的婚前保证书
2014/02/01 职场文书
幼师自我鉴定
2014/02/01 职场文书
小学家长评语大全
2014/04/16 职场文书
关于中国梦的演讲稿
2014/04/23 职场文书
申报优秀教师材料
2014/12/16 职场文书
爱国影片观后感
2015/06/18 职场文书
村官2015年度工作总结
2015/10/14 职场文书
React配置子路由的实现
2021/06/03 Javascript
SQL Server内存机制浅探
2022/04/06 SQL Server