vue2 plus vee-validate - ES6 없이 오류 메시지를 커스터마이즈하려면 어떻게 해야 합니까?

vue2 plus vee-validate - ES6 없이 오류 메시지를 커스터마이즈하려면 어떻게 해야 합니까?

vee-validate 에러 메시지를 커스터마이즈 하려고 합니다만, Web 사이트의 예에서는 모두 ES6 를 사용하고 있습니다.그것이 없어도 충분히 할 수 있기 때문에, 제가 잘못하고 있는 것에 대한 어떠한 제안도 감사하게 생각합니다.

<script>
    const messages = {
      en: {
        confirmed: "Your password is not confirmed",
        email: "I really dont like your email"
      }
    };

    Vue.use(VeeValidate);
    var app = new Vue({
        el: '#app'            
    });
    app.$validator.updateDictionary(messages);
</script>

오류는 없으며 기본 메시지가 사용됩니다.

갱신하다

아래는 저의 HTML 코드입니다.

<input type="text" name="email" v-validate data-vv-rules="required|email" />
<span v-show="errors.has('email')">{{ errors.first('email') }}</span>

<input type="password" name="password" v-validate data-vv-rules="required" />
<span v-show="errors.has('password')">{{ errors.first('confirmation')}} </span>  
<input type="password" name="confirmation" v-validate data-vv-rules="confirmed:password"/>
<span v-show="errors.has('confirmation')">{{ errors.first('confirmation')}}/span>

() =>는 ES6에서 함수를 정의하기 위한 구문이며 vee-validate 구문을 이전 Javascript로 변환합니다.

따라서 매뉴얼을 참조해 주십시오.

alpha: () => 'Some English Message'

와 동등할 것이다

alpha: function() {
  return 'Some English Message'
}

마찬가지로 다음과 같이 변경해야 합니다.

<script>
    const messages = {
      en: {
        confirmed: function () { 
            return "Your password is not confirmed"
        },
        email: function () { 
            return "I really dont like your email"
        }
      }
    };

    Vue.use(VeeValidate);
    var app = new Vue({
        el: '#app'            
    });
    app.$validator.updateDictionary(messages);
</script>

작업 예제를 사용하여 답변 업데이트

위의 코드에 구문 오류가 있는 것 같습니다.다음은 최신 vee-validate 구문을 사용하는 동작 코드입니다.

<script>
const dictionary = {
  en: {
    messages: {
      confirmed: function () { 
        return "Your password is not confirmed"
      },
      email: function () { 
        return "I really dont like your email"
      }
    }
  }
};

VeeValidate.Validator.updateDictionary(dictionary);
Vue.use(VeeValidate);
Vue.config.debug = true;
var App = new Vue({
    el: '#app'
});
</script>

작업용 바이올린

언급URL : https://stackoverflow.com/questions/41073224/vue2-plus-vee-validate-how-to-customize-error-messages-without-es6