vue学习v-on:click绑定HTML的单击事件

vue学习v-on:click绑定HTML的单击事件

v-on:click缩写为@click

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8" />
  <title>125jz.com-vue</title>
  <script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
 </head>
 <body>
  <div id="app">
   <button @click="greet">123</button>
  </div>
  <script>
   var app=new Vue({
    el:"#app",
    data:{
     name:'vue.js!'
    },
    methods:{
     greet:function(){
      alert(this.name+'的方法被调用了!')
     }					
    }
   })
  </script>
 </body>
</html>

v-on指令绑定一个事件监听器,通过它调用VUE实例中定义的方法。

125jz网原创文章。发布者:江山如画,转载请注明出处:http://www.125jz.com/7199.html

(1)
江山如画的头像江山如画管理团队
vue学习-我的第一个vue代码
上一篇 2020年6月14日 上午9:15
9个免费好用的ftp软件-上传网页必备
下一篇 2020年6月18日 上午8:22

99%的人还看了以下文章

  • 太赞了!推荐2个多彩渐变配色网站

    1、根据心情和情绪生成的渐变色 https://gradienmood.posandu.me/ 色彩是拥有情绪的,但是有情绪的色彩有不一定仅仅只有一种颜色。这个名为 Gradien Mood 的渐变色网站会将不同感觉和渐变色搜集起来,其中有的渐变色甚至拥有极为复杂的情绪,而你需要做的,就是输入你想传递的情绪,然后就能搜到相关的情绪和色彩,包括渐变的 CSS …

    2023年1月18日
    7.2K0
  • 网页中的框架(详解)

    所谓框架便是网页画面分成几个框窗,同时取得多个 URL。 一、制作框架页面的步骤: 1.编写所有子框架页面2.编写主框架页面3.在主框架页面中设定子框架名称4.如果框架页面之间存在链接,在子框架中设定链接。 注意:框架页面是不含标签的 二、基本语法 <frameset> <frame src=”url”> <noframes&g…

    2020年4月11日
    15.4K0
  • 第14课:元素的定位

    CSS定位令你可以将一个元素精确地放在页面上你所指定的地方。联合使用定位与浮动(参见第13课),你将能够创建多种高级而精确的布局。本课我们将讨论以下内容: CSS定位的原理 绝对定位 相对定位 CSS定位的原理 把浏览器窗口想象成一个坐标系统: CSS定位的原理是:你可以将任何盒子(box)放置在坐标系统的任何位置上。 假设我们要放置一个标题。通过使用盒状模…

    2020年2月25日
    6.5K0
  • 跟永哥学HTML5(1):认识html5

    HTML5(简称H5),是超文本标记语言(HTML)的第五次重大修改,是最新一代的超文本标记语言,它不单单是一种标记语言,更为下一代 Web 提供了全新功能 。

    2018年1月21日
    2.7K0
  • CSS图形绘制练习-最常见的40种形状和图形源码分享

    CSS图形绘制练习-最常见的40种形状和图形源码分享CSS图形绘制练习-最常见的40种形状和图形源码分享CSS图形绘制练习-最常见的40种形状和图形源码分享CSS图形绘制练习-最常见的40种形状和图形源码分享

     CSS3可以实现很多漂亮的图形,本文从互联网收集了最常见的40种形状和图形,现分享给大家。 包括圆形,椭圆形,三角形,倒三角形,左三角形,右三角形,菱形,梯形,长方形,正方形,圆环,平行四边形,五角星,六角星,五边形,六边形,八边形,心形,蛋形,无穷符号,消息提示框,钻石,八卦图,食豆人,扇形,月牙,顶左直角三角形,顶右直角三角形 ,底左直角三角形 ,底右…

    2020年2月22日 网页制作
    14.9K0
  • 0基础学CSS

    本CSS教程能够让你在数小时内入门CSS,要求你有基本的HTML经验。

    2020年2月22日
    7.7K0

发表回复

登录后才能评论