shentao / vue-multiselect

Universal select/multiselect/tagging component for Vue.js
https://vue-multiselect.js.org/
MIT License
6.71k stars 989 forks source link

VeeValidate Validation Provider with Vue-MultiSelect doesn't work #1078

Open dcabanales opened 5 years ago

dcabanales commented 5 years ago

Hi, I'm trying to use ValidationProvider/ValidationObserver from vee-validate with vue-multiselect, but it doesn't work... Do you any idea how to?

shentao commented 5 years ago

Please provide reproduction codesandbox.

MayaraRMA commented 4 years ago
<ValidationProvider
    tag="div"
    :rules="rules"
    :name="label || inputName"
    v-slot="{ errors }"
  >
<multiselect
      v-model="inputValue"
      :options="options"
      :id="inputName"
      :name="inputName"
      :ref="inputName"
      :tabindex="tabIndex"
      :track-by="trackBy"
      @search-change="searchQuery"
      :multiple="isMultiple"
      :searchable="searchable"
      :close-on-select="closeOnSelect"
      :custom-label="customLabel"
      :loading="showLoadingSpinner"
      :placeholder="placeholder"
      selectLabel=""
      deselectLabel=""
      selectedLabel=""
      :disabled="inputOff"
      :block-keys="['Enter']"
      :group-select="groupSelect"
      :group-label="groupLabel"
      :group-values="groupValues"
      :class="{
        'select-secondary-fail': errors[0]
      }"
    >
    </multiselect>
    <p class="message-error">
      <span v-if="errors[0]" class="label-secondary-fail">{{ errors[0] }}</span>
    </p>
  </ValidationProvider>

this way worked for me