Vue使用

白日梦想家Zzzzz

于 2022-03-13 13:56:55 发布

阅读量912

点赞数

文章标签： vue.js elementui javascript

本文链接：https://blog.csdn.net/weixin_59821542/article/details/123450689

版权

<html>
    <head>
        <meta charset="utf-8" />
        <script src="js/vuejs-2.5.16.js"></script>//导入vuejs
    </head>
    <body>
    <div id="app">
    	{{message}}
        //点击事件,可以传参数
        <button v-on:click="fun1('msg')">vueçš„onclick</button>
        //键盘输入事件
        Vue:<input type="text" v-on:keydown="fun($event)">
    </div>
        <script>
            new Vue({
                el:'#app', //表示当前vue对象接管了div区域
                data:{//数据绑定
                	message:'hello world' //注意不要写分号结尾
                }，
                methods:{
				fun1:function(msg){
				    alert("Hello");
				    this.message = msg;
				}
            /* $event 它是vue中的事件对象  和我们传统js的event对象是一样的  */
			    fun:function(event){
                    var keyCode = event.keyCode;
                    if(keyCode < 48  || keyCode > 57){
                        //不让键盘的按键起作用
                        event.preventDefault();
                    }
				}
            });
        </script>
    </body>
</html>

白日梦想家Zzzzz

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Vue使用

<html> <head> <meta charset="utf-8" /> <script src="js/vuejs-2.5.16.js"></script>//导入vuejs </head> <body> <div id="app"> {{message}} //点击事件,可以传参数 <butt.
复制链接

扫一扫