<!DOCTYPE html>
<html lang="zh"> <head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<link href="../css/style.css" rel="stylesheet"> </head> <body>
<div id="myApp">
<p>您最喜欢的游戏是:{{mygame}}</p>
<button v-on:click="btnClick('我的世界')">我的世界</button>
<button v-on:click="btnClick('勇者斗恶龙')">勇者斗恶龙</button>
<button v-on:click="btnClick('塞尔达传说')">塞尔达传说</button>
<button @click="btnClick('魔界战记5')">魔界战记5</button>
</div>
<script>
var myApp = new Vue({
el: '#myApp',
data: {
mygame: '超级马里奥'
},
methods: {
btnClick: function(pname){
this.mygame = pname;
},
},
});
</script>
</body> </html>

按钮事件v-on的更多相关文章

  1. Java Hello World例子和添加按钮事件与功能

    新建android工程,然后默认“下一步”即可完成创建: 2.添加Button 3.在src的MainActivity.java添加以下红色代码 import android.support.v7.a ...

  2. Android开发系列之按钮事件的4种写法

    经过前两篇blog的铺垫,我们今天热身一下,做个简单的例子. 目录结构还是引用上篇blog的截图. 具体实现代码: public class MainActivity extends Activity ...

  3. Android按钮事件的4种写法

    经过前两篇blog的铺垫,我们今天热身一下,做个简单的例子. 目录结构还是引用上篇blog的截图. 具体实现代码: public class MainActivity extends Activity ...

  4. android安卓开发基础小笔记,添加按钮事件,打开新窗体,窗体传值,回传

    给一个按钮添加onclick事件 //获取按钮对象 Button Aiyo = (Button)findViewById(R.id.button1); Aiyo.setOnClickListener( ...

  5. ngui中 代码调用按钮事件(后来改成了按钮绑定键盘..)

    ngui中 代码调用按钮事件 好烦人啊这个问题, 我弄完发上来 这个问题解决了一半 发现可以用 按钮绑定来解决这个问题,并且更安全方便快速 直接在按钮上添加一个 key binding 指定按键 搞定 ...

  6. MVC中使用内建的HTML辅助方法产生表单元素提交表单与button按钮事件的陷阱

    网站模板页有个登陆的退出按钮,当点击时跳转到登陆页面. <button onclick="logout()" >退出</button> $("#l ...

  7. JS调用水晶报表打印翻页按钮事件

    默认的水晶报表打印按钮.翻页按钮太小,并且样式不好调整,考虑自己做一个按钮,然后调用水晶报表的按钮事件. 在实际操作中发现可以在.net按钮的服务器端事件中调用翻页方法: CrystalReportV ...

  8. ASP.NET多个Button的页面,回车执行按钮事件(转)

    主要有两种实现方法分别是:JavaScript的方法与Panel的方法 一.JavaScript的方法 ①单输入框(文本框)单按钮的实现方法 以下功能实现:在输入框中输入内容之后,按回车键就执行按钮事 ...

  9. asp.net中父子页面通过gridview中的按钮事件进行回传值的问题

    这两天写BS程序,遇到父子页面传值的问题,以前没写过web系统,用了几天时间才将问题解决,总结下记录下来: 问题描述: 父页面A中有一个gridview,每行6个列,有5列中均有一个按钮,单击按钮,会 ...

  10. asp.net中用回车代替按钮事件

    第一步,先编写简单的页面代码,这里我们只需要一个按钮就足够了.当然,还有按钮事件. <html> <head> <title>测试绑定enter</title ...

随机推荐

  1. 【洛谷】P1962

    题目链接:https://www.luogu.org/problemnew/show/P1962 题意:求fib数列的第n项,很大.mod 1e9+7. 题解:BM直接推. 代码: #include ...

  2. docker集群管理之kubernetes

    一.简介 kubernetes又叫做k8s,是Google开发的一款开源的docker集群管理工具,在这里对它的“发家史”,我不做过多的阐述,有时间大家可以自己去百度一下: 下面我要讲的就是容易混淆的 ...

  3. iOS 工程实现native 跳转指定的Flutter 页面

    概要 在前一篇文章中我们提到,iOS跳转到Flutter工程指定页面时(多个),Flutter只有单例,设置setInitialRouter 无效,如下 let flutterViewControll ...

  4. 随笔记录 Linux基本操作命令 2019.7.27

    临时关闭防火墙systemctl stop firewalld永久关闭防火墙systemctl disable firewalld 临时关闭selinux安全机制setenforce 0永久关闭sel ...

  5. .net 裁剪图片

    private void GetImg() { ) { return; } ]; string[] imgsize = Request["imgsize"].Split('& ...

  6. 跟我一起使用Vue.js + Docker 部署项目

    本文学习自:https://juejin.im/post/5bee5ddde51d457b8a33938c 项目环境是在ubuntu下,记得要在root目录下,不然安装vue会报错 npm insta ...

  7. 用Jquery写返回顶部代码

    <!DOCTYPE html><html><head><meta charset="utf-8" /><title>jq ...

  8. Android开发 AndroidStudio解决Error:moudle not specified

    问题描述 在使用Android Studio 进行Builder APKs的时候,如果发现无法degub, 进行配置的时候 没有module可以进行指定 问题原因 项目未与Grade Files 文件 ...

  9. MySql General error:2006

    当启用模块时发生Mysql数据库错误,错误信息见附件,实际是“General error: 2006 MySQL server has gone away......”错误. 解决方法:找到my.in ...

  10. pipenv的使用

    首先,确保pip install pipenv已经安装 1.新建一个文件夹,并在地址栏输入cmd,回车. 2.输入pipenv install,等待虚拟环境搭建完毕. 3.输入pipenv shell ...