Question

以下是我的代码。实际上我想要本地化一些消息和属性名称使用vee-validation。我能够本地化仅在使用E.g时发出的消息：this。$ validator.localize（'en'，{ 消息：{required：（field）=＆gt; '*'+ field + required'}，属性：{email：'Email'}}）;在“created（）”函数内。但我想在“main.js”中给出这个。每当我打电话给这个在main.js中它抛出错误，如“Uncaught TypeError：不能读取属性'localize'未定义“我的代码在main.js.我已经给出了这个 main.js中的代码，因为我想通过我的项目访问在所有vue文件中。请帮忙

import Vue from 'vue'
import App from './App'
import router from './router'
import VeeValidate from 'vee-validate';
import { Validator } from 'vee-validate';

Vue.use(VeeValidate);

this.$validator.localize('en', {
      messages: {
        required: (field) => '* ' + field + ' is required'
      },
      attributes: {
        email: 'Email'
      } 
    });

new Vue({
  el: '#app',
  router,
  template: '<App/>',
  components: {
    App
  }
})

Answer 1

在你的代码示例中，this.$validator在不知名的地方被调用...你需要把它放在你的Vue实例中，例如在挂钩中：

new Vue({
  el: '#app',
  router,
  template: '<App/>',
  components: {
    App
  },
  mounted() {
    this.$validator.localize('en', {
      messages: {
        required: (field) => '* ' + field + ' is required'
      },
      attributes: {
        email: 'Email'
      } 
    })
  }
})

Answer 2

如果要更改所有默认消息，请包括一些属性更改。定义您的消息，然后将其安装在主js文件中

         const dict = {
            messages: {
                required: (field) => 'Please Enter ' + field + ''
            },
            attributes: {
                name: 'Name',
                email: 'Email Id '
            }
        }
        const app = new Vue({
            el: '#app',
            router: router,
            components: {
                App
            },
            mounted() {
                this.$validator.localize('en', dict);
            }
        });

  //  Make to change in single required message
    const dict = {
        custom: {
            email: {
                required: 'Please Enter Valid Email Id'
            },
            name: {
                required: 'Name include first and last name'
            }
        }
    }
    const app = new Vue({
        el: '#app',
        router: router,
        components: {
            App
        },
        mounted() {
            this.$validator.localize('en', dict);
        }
    });

如何使用vee-validation在vuejs中本地化erorr消息

2 个答案: