1

Option API を使用して Vue 2 アプリで formvalidation.io プラグインを使用しましたが、Vue バージョンを 3 に更新し、Composition API を使用し始めましたが、もう機能していません。

formvalidation.io プラグインをインポートする方法は次のとおりです。

import formValidation from '@/assets/plugins/formvalidation/dist/es6/core/Core';
// FormValidation plugins
import Icon from '@/assets/plugins/formvalidation/dist/es6/plugins/Icon';
import Trigger from '@/assets/plugins/formvalidation/dist/es6/plugins/Trigger';
import Bootstrap from '@/assets/plugins/formvalidation/dist/es6/plugins/Bootstrap';
import SubmitButton from '@/assets/plugins/formvalidation/dist/es6/plugins/SubmitButton';

次に、setup()関数で検証インスタンスを作成しています。

const validation = formValidation(
   _signupForm,
   {
      fields: {
         ...
      },
      plugins: {
         trigger: new Trigger(),
         bootstrap: new Bootstrap(),
         icon: new Icon({
            valid: 'fa fa-check',
            invalid: 'fa fa-times',
            validating: 'fa fa-refresh'
         }),
         submitButton: new SubmitButton(),
       }
    
   }
);

公式ドキュメントに示されているのと同じ方法で使用しています: https://formvalidation.io/guide/examples/integrating-with-vue

アプリを開くと、ブラウザ コンソールでこのエラーが発生します。

classSet.js?c52a:1 Uncaught (in promise) TypeError: Cannot read property 'classList' of null
   at eval (classSet.js?c52a:1)
   at Array.forEach (<anonymous>)
   at s (classSet.js?c52a:1)
   at eval (classSet.js?c52a:1)
   at Array.forEach (<anonymous>)
   at c (classSet.js?c52a:1)
   at s.install (Framework.js?e18a:1)
   at l.registerPlugin (Core.js?b275:1)
   at eval (Core.js?b275:1)
   at Array.forEach (<anonymous>)

formValidation.io は vue3 をサポートしていないと思いますが、それに関する情報は見つかりませんでした。

手伝ってくれますか?

4

0 に答える 0