Question

我使用的是最新版本的vuejs。我想在用户更改输入后立即触发事件

我尝试了两种方法：

一旦值更改（@ change =“ modifie”）尝试启动事件
尝试依赖json的数据（如果存在两种数据绑定方式，则应进行转换）

（我更喜欢第一种方法，我只需要检查一个值）

Tks

    $(document).ready(function () {
        vuepanier = new Vue({
            el: '#panier',
            data: {
                panier: [{"id":"1612","qty":3},{"id":"1614","qty":1}]
            },
            methods: {
                modifie: function(event, id) {
                alert(id);
                },
            supprime: function(event, id) {
                alert(id);
            }
            }
        });
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="panier">
            <div v-for="item in panier">
                <input type="number" v-bind:id="'spinnermod' + item.id" v-bind:value="item.qty"><br/>
                <button type="button" class='btn btn-sm text-white texteopaque' v-on:click="supprime($event, item.id);">delete</button>
            </div>
</div>

Answer 1

我想在用户更改输入后立即触发事件

输入更改后立即触发事件，您只需在v-on:input中使用@input或<input/>

这是您要找的吗？

    $(document).ready(function () {
        vuepanier = new Vue({
            el: '#panier',
            data: {
                panier: [{"id":"1612","qty":3},{"id":"1614","qty":1}]
            },
            methods: {
                modifie: function(event, id) {
                alert(id);
                },
            supprime: function(event, id) {
                alert(id);
            }
            }
        });
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="panier">
            <div v-for="item in panier">
                <input @input="supprime($event, item.id)" type="number" v-bind:id="'spinnermod' + item.id" v-bind:value="item.qty"><br/>
                <button type="button" class='btn btn-sm text-white texteopaque' v-on:click="supprime($event, item.id);">delete</button>
            </div>
</div>

在vuejs中，输入事件触发不在列表内

1 个答案: