Vue.js: 获取选中复选框的值

Question

我有自己的复选框组件（多复选框-select 来自这里：https://qvault.io/javascript/how-to-create-a-custom-checkbox-form-in-vue/）。我想将复选框的 selected 值输出为文本，但我只得到当前 selected 的值。 我做错了什么？

<CustomCheckboxSelect
                v-model="optionsSelect"
                :options="options"
                checked="value"
                validation="required"
                input-has-errors-class="is-invalid"
                errors-class="invalid-feedback"
                error-behavior="submit"
                placeholder="Choose"
              />

<span class="test">{{ optionsSelect }}</span>

Answer 1

您的组件似乎正在发出一个 input，因此您需要在父组件中阅读它

<CustomCheckboxSelect
                v-model="optionsSelect"
                :options="options"
                checked="value"
                validation="required"
                input-has-errors-class="is-invalid"
                errors-class="invalid-feedback"
                error-behavior="submit"
                placeholder="Choose"
                @input="checkboxValue"
              />

并在您的 <script> 中添加一个方法来读取

 methods: {
    checkboxValue: function (boxValue) {
        console.log(boxValue);
      }
    }