动力节点首页 全国咨询热线:400-8080-105

绑定手机号,登录
手机号

验证码

微信登录
手机号登录
手机号

验证码

微信登录与注册
微信扫码登录与注册

扫码关注微信公众号完成登录与注册
手机号登录
首页 > 文章

Vue点击click事件解析

07-08 13:01 3482浏览
举报 T字号
  • 大字
  • 中字
  • 小字

vue算是前端技术比较火的一门技术了,所以在日常开发当中掌握它还是比较重要的,废话不多说,先上代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--<script src="./vue.js"></script>-->
    <script src="2.5.20-vue.js"></script>
</head>
<body>
<div id="app">

//@click点击事件getMethod和getMethod()带不带小括号其实没多大的区别,vue在底层会把传过去的函数统一解析成为方法,带小括号说明有相应的实参传入方法体里面;

    <!--<p   @click="getMethod">aaaa</p>-->       
    <!--<p   @click="getMethodFun">aaaa</p>-->
    <p   @click="getMethod()">aaaa</p>
    <p   @click="getMethodFun()">bbbb</p>
</div>
</body>
<script>
    var app = new Vue({
        el: '#app',
        data: function () {
            return {
                message: 'father',
                show: true
            };
        },
        methods: {
            getMethod () {      //点击事件的时候去寻找相应的方法,在底层做转换直接写方法名,大括号里面写相应的业务逻辑
                console.log('11');
            },
 //也可以采用匿名函数的写法定义方法名,然后进行调用这种方法也是可以的,只不过getMethod ()的写法更加简洁,但是在实际开发当中这个可是不支持的例如   aaFunc (){}         //直接这样写是会报错的,一定要注意;
            getMethodFun: function () {   
                console.log('22')
            }
        },
    });
</script>
</html>

动力节点在线课程涵盖零基础入门,高级进阶,在职提升三大主力内容,覆盖Java从入门到就业提升的全体系学习内容。全部Java视频教程免费观看,相关学习资料免费下载!对于火爆技术,每周一定时更新!如果想了解更多相关技术,可以到动力节点在线免费观看Vue入门视频教程学习哦!

0人推荐
共同学习,写下你的评论
0条评论
杨晶珍
程序员杨晶珍

98篇文章贡献357785字

相关课程 更多>

作者相关文章更多>

推荐相关文章更多>

JavaWeb的3大组件

代码小兵49806-11 15:28

全面解析Cookie技术

代码小兵49806-11 15:51

浅谈JavaWeb架构演变

代码小兵49806-11 16:22

探讨Web开发中的Session存储与管理

代码小兵51603-29 17:28

JavaScript基础知识

 暴风城-小飞04-06 20:49

发评论

举报

0/150

取消