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 相关文章推荐
在Google 地图上实现做的标记相连接
Jan 05 Javascript
浅析javascript异步执行函数导致的变量变化问题解决思路
May 13 Javascript
微信小程序 loading(加载中提示框)实例
Oct 28 Javascript
Form表单按回车自动提交表单的实现方法
Nov 18 Javascript
5种JavaScript脚本加载的方式
Jan 16 Javascript
JS+html5 canvas实现的简单绘制折线图效果示例
Mar 13 Javascript
jquery DataTable实现前后台动态分页
Jun 17 jQuery
JS中Attr的用法详解
Oct 09 Javascript
AnglarJs中的上拉加载实现代码
Feb 08 Javascript
Vue插件打包与发布的方法示例
Aug 20 Javascript
js实现多图和单图上传显示
Dec 18 Javascript
JS前端轻量fabric.js系列之画布初始化
Aug 05 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加密解密的代码
2007/07/16 PHP
PHP第一季视频教程(李炎恢+php100 不断更新)
2011/05/29 PHP
ThinkPHP模型详解
2015/07/27 PHP
PHP array_key_exists检查键名或索引是否存在于数组中的实现方法
2016/06/13 PHP
PHP中类的自动加载的方法
2017/03/17 PHP
jquery text,radio,checkbox,select操作实现代码
2009/07/09 Javascript
JQuery从头学起第一讲
2010/07/04 Javascript
js 第二代身份证号码的验证机制代码
2011/05/12 Javascript
javascript 保存文件到本地实现方法
2012/11/29 Javascript
js判断鼠标同时离开两个div的思路及代码
2013/05/31 Javascript
浅析jquery某一元素重复绑定的问题
2014/01/03 Javascript
JavaScript中合并数组的N种方法
2014/09/16 Javascript
深入分析Javascript跨域问题
2015/04/17 Javascript
js匿名函数作为函数参数详解
2016/06/01 Javascript
jQuery中Ajax全局事件引用方式及各个事件(全局/局部)执行顺序
2016/06/02 Javascript
Bootstrap实现input控件失去焦点时验证
2016/08/04 Javascript
jQuery实现的自动加载页面功能示例
2016/09/04 Javascript
js实现移动端编辑添加地址【模仿京东】
2017/04/28 Javascript
vue2 自定义动态组件所遇到的问题
2017/06/08 Javascript
详解node-ccap模块生成captcha验证码
2017/07/01 Javascript
JS实现字符串中去除指定子字符串方法分析
2018/05/17 Javascript
node.js实现带进度条的多文件上传
2020/03/27 Javascript
vue任意关系组件通信与跨组件监听状态vue-communication
2020/10/18 Javascript
python3实现SMTP发送邮件详细教程
2018/06/19 Python
python3监控CentOS磁盘空间脚本
2018/06/21 Python
python 获取域名到期时间的方法步骤
2021/02/10 Python
pandas统计重复值次数的方法实现
2021/02/20 Python
Urban Outfitters英国官网:美国平价服饰品牌
2016/11/25 全球购物
美国真皮手袋品牌:GiGi New York
2017/03/10 全球购物
英国时尚首饰品牌:Missoma
2020/06/29 全球购物
香奈儿美国官网:CHANEL美国
2020/05/20 全球购物
竞聘演讲稿
2014/04/24 职场文书
民间借贷协议书范本
2014/10/01 职场文书
小学体育组工作总结2015
2015/07/21 职场文书
2019年手机市场的调研报告2篇
2019/10/10 职场文书
Python合并多张图片成PDF
2021/06/09 Python