vue的学习笔记（1）：v-on的使用

vue是一个前段框架，也是比较有名的，它是写在.js文件里面，我们有三种引入vue框架的方式，第一种是通过cdn，也就是网页上面的资源，第二个就是自己下载一个vue的.js文件引入，第三个就是npm了，没有学过的小伙伴们可以去看我的专栏了解一下什么是npm这个东西；

好了，这一期我们就讲解一下在我们学习vue的过程中，v-on的一些基本使用，我们引入vue之后，只需要new vue({})就表示你已经开始了框架的使用了，是不是很神奇？

new Vue({
        //元素对象
        el:'#app',
        //数据对象
        data:{
            counte: 0,
            message:'你好，李焕英',
            movies:['唐僧','孙悟空','猪八戒','沙和尚'],
            tag:'百度一下',
            name:'李天王',
            age:'18',
            myclass:'物联网2003',
            blind:'动态绑定属性',
            isred:true,
            isgreen:false,
            imgurl:'./img/apple.jpg',
            fristname:'Tony',
            lastname:'Jkson',
            key:'键盘'
        }})

 包括那个bootstrap的框架使用也是比较快捷的，如果对这种用法还难以理解的可以去看看我的专栏jQuery那一部分，就会发现这个不就跟$很像；

废话不多说，我们来看看什么是v-on，其实这就是一个监听事件，在我们jQuery中也有，而且为了避免一些事件的冒泡，jQuery就是使用的on来实现的监听；

on:click = "shownumber()">{{movies[0]}}

有一个简便写法，也叫作语法糖：

"showobj(123,$event)">{{movies[1]}}

这里填的是一个函数，如果是一些简单的实现我们可以直接写表达式；

            shownumber(){
                console.log("1")
            },
            showobj(a,event){
                console.log(a )
                console.log(event)
            }

这里的$符号是可以拿到js对象的，而不是传参；

2、修饰符

监听事件有一些修饰符，比如stop、prevent等，它们的作用是用来限定事件的，我们直接在语法糖后面点出属性即可：

"fatherlisten" >
            父类
            stop="sonlisten">子类