【问题标题】:Getting the value of button (vuejs)获取按钮的值(vuejs)
【发布时间】:2020-10-05 14:29:57
【问题描述】:

我想在单击时获取按钮的值我已经添加了一个方法。但每当我点击那里什么都没有。值不通过。谁能帮我?谢谢。

代码如下:

<button
class="button buttonvalue"
v-for="(p,index) in buttonvalue"
:key="index"
@click="webcamSendRequestButton($event)"
>{{p}}</button>

方法:

  methods: {
    webcamSendRequestButton: function(e) {
    // const buttonValue = e.target.value;
    // console.log(e.target.value)
    alert(e.target.value);
    }
  }

按钮值的DATA(Json)

数组数据:小、中、大

this.buttonvalue= this.item[0].buttonvalue.split(',');

【问题讨论】:

    标签: vue.js vuejs2 vuejs3


    【解决方案1】:

    要获取值按钮值,您可以先绑定:value 属性,例如:

    <button
      class="button buttonvalue"
      v-for="(p,index) in buttonvalue"
      :key="index"
      @click="webcamSendRequestButton($event)"
      :value="p"
    >{{p}}</button>
    

    那么e.target.value 就可以正常工作了。


    或者,如果您不想添加其他属性,那么您可以简单地使用:

    methods: {
      webcamSendRequestButton(e) {
         console.log(e.target.textContent)
      }
    }
    

    而不是使用e.target.value


    或者,如果需要值 p,那么您可以简单地将其传递给单击处理程序,例如:

    @click="webcamSendRequestButton(p)"
    

    然后像这样访问它:

    methods: {
      webcamSendRequestButton(buttonvalue) {
         console.log(buttonvalue)
      }
    }
    

    【讨论】:

      【解决方案2】:

      例如,如果您只需要传递p 的值,那么您可以这样写:

      @click="webcamSendRequestButton(p)"

      然后在你的方法中:

        methods: {
          webcamSendRequestButton(val) {
             alert(val);
          }
        }
      

      我假设buttonvalue 是某种array,您正在循环访问。

      希望对你有帮助。

      【讨论】:

      • 是的,它确实帮助了pp..现在试试。非常感谢啊啊啊!!!
      • 很高兴听到。享受 Vue!
      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2018-10-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-12-05
      • 2017-02-06
      • 2015-10-20
      相关资源
      最近更新 更多