Question

当用户通过v-for选择我正在渲染的复选框之一时，我想调用一个方法。它们都通过v-model绑定到一个变量。问题是input上似乎无法使用v-checkbox。并且以下代码不执行任何操作：

<template>
    <v-container>
        <v-layout row>
                <v-flex xs12>
                <v-layout justify-center>
                    <v-form ref="form" lazy-validation>
                        <v-checkbox
                        v-for="(answer, index) in questions[actualIndex].answers"
                        :key="index"
                        :ref="'check'+index"
                        :label="answer.answer"
                        :value="answer.answer"
                        v-model="checkbox"
                        @input="onInput()"
                        ></v-checkbox>
                    </v-form>
                </v-layout>
            </v-flex>
            </v-layout>
    </v-container>
</template

export default {
data() {
    return {
    checkbox: ''
        }
    },
methods: {
onInput() {
        console.log("WORKS");

    }

  }
}

但是，如果我改用@change或@click事件，则效果很好。有什么想法我做错了吗？

Answer 1

v-model的

VCheckbox绑定到input-value道具和change事件，因此它不会对input事件作出反应。从规格上来看并不太明显，我必须阅读source code才能理解。

这是我需要做的事情而不是简单地更新变量时要做的事情。

    <v-checkbox
        :input-value="some expression"
        @change="doWhatever($event)"
    ></v-checkbox>

如果您需要更新变量并获取回调，则可以使用v-model和@change。

输入事件似乎在vuetify复选框上不可用？

1 个答案: