vue事件传值使用 dataset 对象传值

我爱学习yq

于 2023-09-05 21:16:53 发布

阅读量183

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/m0_74801194/article/details/132700629

版权

 
<button class="btn btn-success" @click="doUpdate" :data-snum="s.stuNum"
                                :data-sname="s.stuName" :data-simg="s.stuImg">修改</button>
 
<script type="text/javascript">
    var vm = new Vue({
        el: '#app-15',
        data: {
            stu: [
                {
                    stuNum: "10010",
                    stuImg: "img/1.jpg",
                    stuName: "Tom",
                    stuGender: "M",
                    stuAge: 20
                }
            ]
        },
        methods: {
            doUpdate: function (event) {
                    // 如果 v-on 绑定的 js 函数没有参数，调用的时候可以省略 (), 同时可以给 js 函数一个 event 参数（事件对象）
                    // 1. event 表示触发当前函数的事件
                    // 2. event.srcElement 表示发生事件的元素 --- 修改按钮
                    // 3. event.srcElement.dataset 表示按钮上绑定的数据集 （data-开头的属性）
                    alert("---update:");
                    let stu = event.srcElement.dataset;
                }
        }
    })
</script>