Question

这是我在commonValidation.js中给出的代码。

commonValidation.js：

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

我想在mount函数内的main.js中调用上面的文件如下。但它不起作用。如果我在mounted（）（在main.js中）方法中给出了那些验证（来自commonValidation.js），它就可以正常工作。

main.js：

import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'
import App from './App'
import router from './router'
import VeeValidate from 'vee-validate';
import commonValidation from './commonValidation'

Vue.use(VeeValidate);
Vue.use(BootstrapVue);

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

请帮我调用main.js中的mounted（）内的commonValidation.Js。提前谢谢。

这是我完整的commonValidation.js

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

Answer 1

您正在commonValidation.js文件中导出对象。无法像函数一样调用对象。

我认为您的意图是使用mixin。 mixin只不过是一个包含可重用组件选项作为其属性的对象。

所以只需在main.js文件中的根组件上注册mixin：

//main.js
import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'
import App from './App'
import router from './router'
import VeeValidate from 'vee-validate';
import commonValidation from './commonValidation'

Vue.use(VeeValidate);
Vue.use(BootstrapVue);

new Vue({
    el: '#app',
    router,
    template: '<App/>',
    components: {
        App
    },
    mixins : [commonValidation]
}

Vuejs - 如何从另一个Js文件中调用main.js的挂载函数

1 个答案: