时间戳

首页 > 解决方案 > eslint vee 验证 no-unused-vars

vue.js - eslint vee 验证 no-unused-vars

问题描述

将 Vee Validate 与 Vue 结合使用，编译时出现以下错误：

error: 'required' is defined but never used (no-unused-vars)
error: 'max' is defined but never used (no-unused-vars)

我的代码片段如下

      <ValidationObserver ref="observer" v-slot="{ invalid }" tag="form" @submit.prevent="submit()">
        <div class="form-group">
          <label for="password">Password</label>
          <ValidationProvider rules="required|max:50" v-slot="{ errors }">
            <input type="password" v-model="password" name="password" class="form-control"/>
            <span>{{ errors[0] }}</span>
          </ValidationProvider>
        </div>
      </ValidationObserver>

<script>
import { ValidationProvider, ValidationObserver } from 'vee-validate'
import { required, max } from 'vee-validate/dist/rules'

export default {
  components: {
    ValidationProvider,
    ValidationObserver
  }
}
</script>

我可以通过添加此代码来抑制错误

Vue.use(required)
Vue.use(max)

但这是正确的方法还是我可以在 eslint 中使用设置来防止这些错误？

标签： vue.jseslintvee-validate

解决方案

事实证明这很容易，但我仍然不确定这是否是最好的方法 - 如果有人有更好的答案，请发布！

/* eslint-disable no-unused-vars */
import { required, max } from 'vee-validate/dist/rules'
/* eslint-enable no-unused-vars */

更新 我认为官方方法是扩展您使用的每个规则：

extend('required', required)
extend('max', max)

推荐阅读