使用 vue.js 单击时如何获取按钮的值 [英] How to get the value of button when clicked using vue.js

问题描述

我在一个页面上有几个按钮与相同的方法挂钩 webcamSendRequestButton

I have several buttons on a page which are hooked to the same method webcamSendRequestButton

<button v-on:click="webcamSendRequestButton" value="0" type="button" class="webcam-send-request-button" :disabled="disabled">Verify</button>
<button v-on:click="webcamSendRequestButton" value="1" type="button" class="webcam-send-request-button" :disabled="disabled">Verify</button>
<button v-on:click="webcamSendRequestButton" value="2" type="button" class="webcam-send-request-button" :disabled="disabled">Verify</button>
<button v-on:click="webcamSendRequestButton" value="3" type="button" class="webcam-send-request-button" :disabled="disabled">Verify</button>

当单击按钮时，我正在进行 ajax 调用.在 jquery 或 JS 中，使用 $(this).val();

and I am making an ajax call when the button is clicked. In jquery or JS it is pretty straightforward to get the value of button when clicked using $(this).val();

vue中如何获取按钮点击时的值?

How do I fetch the value of the button when it is clicked in vue?

var app = new Vue({
    el: '#my-div',
    methods: {
        webcamSendRequestButton: function() {

            const buttonValue = ??? // How do I fetch the value over here

            $.ajax({
                url: "someurl",
                type: "POST",
                data: {
                    value: buttonValue
                },
                success: function (data) {
                    // Omitted for brevity
                }
            });
        }
    }
});

推荐答案

您可以简单地将其作为参数提供给函数.

You can simply give it as an argument to the function.

<button v-on:click="webcamSendRequestButton(0)"  type="button" class="webcam-send-request-button" :disabled="disabled">Verify</button>

JS

...
methods: {
  webcamSendRequestButton(value){
     //"value" is the clicked button value
  }
}
...

这篇关于使用 vue.js 单击时如何获取按钮的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！