Vue.js：獲取選定復選框的值

Question

我有自己的復選框組件（從這里多復選框選擇： https : //qvault.io/javascript/how-to-create-a-custom-checkbox-form-in-vue/ ）。 我想將復選框的選定值作為文本輸出，但我只得到當前選定的值。 我究竟做錯了什么？

<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因此您需要在父組件中讀取該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);
      }
    }