在 Vue.js 中，如何在更改输入时启用 v-for 循环中的按钮? [英] In Vue.js, how do I enable buttons in a v-for loop when an input is changed?

问题描述

在我的基线代码中:

https://plnkr.co/LdbVJCuy3oojfyOa2MS7

我希望在输入字段更改时为任何给定行启用按我"按钮.

I would like the 'Press' me button to be enabled for any given row whenever the input field changes.

我修改了代码，添加:

:disabled="isButtonDisabled(dino)

按钮

然后创建以下存根函数:

and then creating the following stub function:

isButtonDisabled: function(dino) {
}

在这之后，我被卡住了.如何将当前值与初始值进行比较以确定是否应该启用按钮?

After this, I'm getting stuck. How can I compare the current value to the initial value to determine whether or not I should enable the button?

如果我不清楚，最重要的是我希望在相应的输入更改时启用一个按钮.

In case I'm being unclear, the bottom line is that I want a button to be enabled whenever the corresponding input has been changed.

推荐答案

另一种选择是在 input 上使用 @input 或 @change 事件来启用按钮.

Another option is to use the @input or @change event on the input to enable the button.

<input type="text" v-bind:value="dino" @input="enableButton" />

然后在您的方法中处理事件.您还可以将 dino 作为参数传递给 @input 事件处理程序.

Then down in your methods handle the event. You could also pass dino as a parameter to the @input event handler.

enableButton: function(e) {
  // determine input from e and toggle button
}

这篇关于在 Vue.js 中，如何在更改输入时启用 v-for 循环中的按钮?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！