用 veeValidate VueJS 确认规则：找不到参考？

Question

我在使用 VueJS 和使用 Vee-validate 时遇到问题。

我正在尝试确认另一个密码，但感觉好像找不到密码的参考。我正在使用 ref 并一直在寻找所有存在的问题，但它仍然不能解决我的问题。

<template>
  <div :class="customClass" v-if="show">
    <label :for="name" v-if="label">{{ label }}</label>
    <div class="relative">
      <input class="w-full" :class="{ 'is-danger': errors.has(name, scope) }" :type="inputHidden? 'password' : 'text'" :data-vv-scope="scope" :data-vv-as="label.toLowerCase()" v-validate="`${validate}`" :id="name" :name="name" v-model="newValue">
      <div @click="inputHidden = !inputHidden">
        <icon-eye class="h-4 absolute pin-r pin-t mt-2 mr-2 cursor-pointer" width="25" v-show="!inputHidden" />
        <icon-disabled-eye class="h-4 absolute pin-r pin-t mt-2 mr-2 cursor-pointer" width="25" v-show="inputHidden" />
      </div>
      <span :class="`${customClass}-error`" v-if="errors.has(name, scope)">{{ errors.first(name, scope) }}</span>
    </div>
  </div>
</template>
<script>

并递归调用组件：

<div class="mb-4" v-for="field in forms.password.fields" :key="field.name">
       <component :is="field.type" v-model="forms.password.values[field.name]" :name="field.name" :placeholder="field.placeholder" :label="field.label" :custom-label-class="field.customLabelClass" :scope="field.scope" :validate="field.validate" :elements="field.elements" :show="field.show" :on-change="field.onChange" />
</div>

通过提供这些道具：

password: {
        values: {
          password: ''
        },
        fields: [{
          name: 'password',
          type: 'input-password',
          label: this.$t('commons.labels.new-password'),
          validate: 'required|verify_password'
        }, {
          name: 'confirmPassword',
          type: 'input-password',
          label: this.$t('commons.labels.confirm-new-password'),
          validate: 'required|confirmed:$password'
        }].map((item) => {
          item['scope'] = 'password'

          return item
        }),

这里是my sandbox 以显示问题所在。

Answer 1

这对我有用： v-validate="{required: true, is: modelPassword}"