码迷,mamicode.com
首页 > 其他好文 > 详细

vue--v-on绑定事件

时间:2019-05-18 15:47:59      阅读:82      评论:0      收藏:0      [点我收藏+]

标签:点击   ack   微信   scale   alert   点击事件   cli   微信小程序   fun   

 1 <html lang="en">
 2 <head>
 3     <meta charset="UTF-8">
 4     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 5     <meta http-equiv="X-UA-Compatible" content="ie=edge">
 6     <title>vue指令v-cloak</title>
 7 </head>
 8 <style>
 9 
10 [v-cloak]{
11 display: none;
12 }
13 
14 </style>
15 
16 <body>
17     <!-- v-cloak解决插值闪烁问题 -->
18     <div id="app">
19         <p v-cloak>{{msg}}</p>
20         <p v-text="msg"></p>
21         <!-- v-html转化代码 -->
22         <p v-html="msg1"></p>
23         <!-- v:bind--绑定属性值  v-bind可以简写:  变量名可以添加属性-->
24         <!-- <input type="button" value="按钮" v-bind:title="mytitle +‘1234‘"> -->
25         <input type="button" value="按钮" :title="mytitle +‘1234‘">
26         <!-- v-on 指令 vue事件/鼠标点击事件 -->
27         <input type="button" value="点击我" v-on:click="show">
28     </div>
29     
30     <script src="../js/vue.js"></script>
31     <script>
32         var vm = new Vue({
33             el: "#app",
34             data: {
35                 msg: 我是一只小猫,
36                 msg1:<h2>我是一只小猫</h2>,
37                 mytitle:"我是标题"
38             },
39             methods:{
40                 //定义函数可以和微信小程序相似
41             show:function(){
42                 alert("我是一只小鸟")
43             }
44             }
45         })
46     </script>
47 </body>
48 </html>

 

vue--v-on绑定事件

标签:点击   ack   微信   scale   alert   点击事件   cli   微信小程序   fun   

原文地址:https://www.cnblogs.com/yuanxiangguang/p/10885748.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!