vue(1)

Stephen_Numb

于 2016-12-30 16:26:37 发布

阅读量535

点赞数 1

本文链接：https://blog.csdn.net/stephen_numb/article/details/53944468

版权

最近在学习大神的vue.js，觉得有一部分和angular.js有点相像。俗话说，好记性不如烂笔头，所以还是觉得写一点博客，望各位大神批评指正。

Vue的指令还是有点多，常用的暂时有如下：

v-on 指令用于监听DOM事件形式如：v-on:click 缩写为 @click;所以下面两个写法的功能都是一样的：

v-for用于循环的遍历，用法如下：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<script src="vue.js"></script>
</head>
<body>
<div id="box" >
<ul v-for="value in arr">
<li>{{value}} {{$index}}</li>
</ul>
<hr>
<ul v-for="(k,v) in json">
<li>{{k}} {{v}}</li>
</ul>
</div>
</body>
<script>
window.onload = function () {
var v = new Vue({
el:'#box',
data:{
msg:'welcome to vue',
arr:['apple','banana','pear'],
json:{a:'apple',b:'banana',c:'paer'},
}
}
})
}
</script>
</html>

对于map类型的，可以使用v-for="(k,v) in json",其中k和v分别值得是key和value.

对于禁止时间冒泡，我觉得作者为大家考虑的很多，@click.stop="show()"就可以实现了，同样的，如果要禁止浏览器的默认行为，比如右键的默认行为，@contextmenu.prevent="show()"就可以实现

Stephen_Numb

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vue(1)

最近在学习大神的vue.js，觉得有一部分和angular.js有点相像。俗话说，好记性不如烂笔头，所以还是觉得写一点博客，望各位大神批评指正。Vue的指令还是有点多，常用的暂时有如下：v-on 指令用于监听DOM事件形式如：v-on:click 缩写为 @click;所以下面两个写法的功能都是一样的：<input type="button" value="click" @
复制链接

扫一扫

vue(1)

“相关推荐”对你有帮助么？