0

vee-validate で必須属性と正規表現属性を設定しようとしています。正規表現ビットは正常に機能しますが、必要な属性を追加するとすぐに、コントロール全体がフォームから消えます。

これは正常に動作しますが ( fiddle )、必要な属性がありません (読みやすいように複数行):

<input 
  v-validate="{ regex:/^((\d{3})[ -]|(\d{3}[ -]?)){2}\d{4}$/ }" 
  :class="{'input': true, 'is-danger': errors.has('phonenumber') }" 
  class="input is-primary" 
  name="phonenumber" 
  type="text" 
  placeholder="404-555-1212"
> <!-- end input -->

これにより、フォーム全体が消えます（fiddle）（読みやすいように複数行）：

<input 
  v-validate="{ required|regex:/^((\d{3})[ -]|(\d{3}[ -]?)){2}\d{4}$/ }" 
  :class="{'input': true, 'is-danger': errors.has('phonenumber') }" 
  class="input is-primary" 
  name="phonenumber" 
  type="text" 
  placeholder="404-555-1212"
> <!-- end input -->

コンマを使用して vee-validate 属性を区切ってみましたが、これも同じように失敗します。

私は何が欠けていますか？

4

1 に答える 1

2

required: true,属性が正しく機能するためには、含める必要がありました。

このような：

<input 
  v-validate="{ required: true, regex:/^((\d{3})[ -]|(\d{3}[ -]?)){2}\d{4}$/ }" 
  :class="{'input': true, 'is-danger': errors.has('phonenumber') }" 
  class="input is-primary" 
  name="phonenumber" 
  type="text" 
  placeholder="404-555-1212"
> <!-- end input -->
于 2018-08-02T21:03:53.973 に答える