使用nuxt.js时如何获得vee-validator的$ validator

Question

我已在vee-validator安装中安装nuxt.js（使用express template）。

我已将插件添加到我的nuxt.config.js文件中，如下所示：

plugins: [
    { src: '~plugins/vee-validate.js' }
]

我还将其添加到构建设置中：

build: {
    vendor: ['vee-validate'],
    ...

当我使用HTML标签时，例如v-validate="'required'"，验证按预期工作，我可以在模板中显示/隐藏错误。

现在我正在尝试设置一个表单，以便在提交时，所有字段都将被验证，并且只有在尝试提交后才会显示错误。为此，我设置了一个类似的方法：

  methods: {
    onLogin: (e) => {
      e.preventDefault()
      console.log('validator', this.$validator)
    }
  }

由于某种原因，this.$validator未定义。有人能告诉我如何才能访问它吗？我试过添加：

inject: ['$validator']

但这似乎没有任何区别。

感谢您的帮助。

Answer 1

原来问题是使用ES6功能样式，养成了从Angular使用它的习惯！

更改：

methods: {
    onLogin: (e) => {
      e.preventDefault()
      console.log('validator', this.$validator)
    }
}

为：

methods: {
    onLogin: function (e) {
      e.preventDefault()
      console.log('validator', this.$validator)
    }
}

现在它运作正常。