追記
一休さんにて、実際にv2→v3にバージョンアップされた際の記事を出されました。

マイグレーションガイドとIssueを深掘り、詳しく書かれているので、目を通すことをお勧めします。

とある仕事でVeeValidateという、Vue.js用バリデーション系のライブラリを使っていて、
今度v2.x→v3.xのバージョンアップを行います。

この記事では、VeeValidate v3における導入方法・使用例をメモとして書き残しておきます。

導入方法
使用例
v2.x→v3.x のマイグレーション方法
おわり

導入方法

以下記事・試したリポジトリを元に導入手順を記載します。

# インストール
npm i vee-validate

import Vue from 'vue'
import { ValidationObserver, ValidationProvider, extend } from 'vee-validate'

// ルールの追加
extend('required', {
  validate(value) {
    return {
      required: true,
      valid: ['', null, undefined].indexOf(value) === -1
    }
  },
  computesRequired: true
})

// コンポーネントの登録
Vue.component('ValidationObserver', ValidationObserver)
Vue.component('ValidationProvider', ValidationProvider)

ルールは必要に応じて追加します。

使用例

<template>
  <validation-observer v-slot="{ handleSubmit }">
    <form @submit.prevent="handleSubmit(submit)">
      <validation-provider name="email" rules="required" v-slot="{ errors }">
        <!-- vue-materialのmd-field -->
        <md-field :class="mdFieldClass(errors)"
          ><label>Vee-Validate Required</label>
          <md-input name="email" v-model="field.email" required></md-input>
          <!-- バリデーションエラー時のメッセージ表示 -->
          <span class="md-error">{{ errors[0] }}</span>
        </md-field>
      </validation-provider>
    </form>
  </validation-observer>
</template>

<script>
export default {
  data() {
    return {
      field: {
        email: ''
      }
    }
  },
  methods: {
    submit() {},
    mdFieldClass(errors) {
      // vue-materialのバリデーションエラー時のクラスを付加
      return {
        'md-invalid': errors.length > 0
      }
    }
  }
}
</script>