其他分享
首页 > 其他分享> > vue中v-on的传参及应用

vue中v-on的传参及应用

作者:互联网

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>v-on的应用及传参</title>

    <script type="text/javascript" src="../js/vue.js"></script>

</head>

<body>

    <div id="root">

        <h2>欢迎{{name}}来学习</h2>

        <button @click='showInfo1'>点我提示信息1(不传参)</button>

        <button @click='showInfo2(66,$event)'>点我提示信息2(传参)</button>

    </div>

</body>

<script type="text/javascript">

    Vue.config.productionTip = false;

    const vm = new Vue({

        el: '#root',

        data: {

            name: '等天黑'

        },

        methods: {

            showInfo1(event) {

                // console.log(this === vm) 此处的this是vm 实例对象

                alert('你好同学!');

            },

            showInfo2(number, event) {

                console.log(number, event)

                // console.log(this === vm) 此处的this是vm 实例对象

                alert('你好同学!!');

            }

        }

    })

//对象里面配方法直接写方法名

</script>

</html>

标签:vue,console,log,提示信息,vm,参及,number,应用,event
来源: https://blog.csdn.net/m0_62168907/article/details/122670321