Vueのjsが - 私は</p> <p>は今、私はこの小道具を受け入れるようにしたい</strong><strong>idFieldTypeの名前で小道具を受け入れるvuejsコンポーネントを構築しています

Question

特定のタイプとして小道具を定義するだけ番号タイプまたは私はまた、オブジェクトへのタイプを交換しようとした

idFieldType: { 
    Type: Function, 
    default: function() { 
     return Number; 
    }, 
    validator: function() { 
     if(value == String || value == Number) { 
       return true; 
     } 

     return false;  
    } 
} 

次のように文字列型は

だから私はそれを書きました。

私の質問は、どのように特定の種類のみを受け入れる小道具を書くことができますか？

[OK]を

Answer 1

は、問題が関数としてのタイプを指定するデフォルト機能を期待したときに、私は、関数を返す関数を返したということでした

idFieldType: { 
       type: Function, 
       default: Number, 
       validator: function (value) { 
        if (value() == String || value() == Number) { 
         return true; 
        } 

        return false; 
       } 
      } 

...解決策を見つけた:)

Answer 2

Vue.JS小道具の検証が組み込まれています。たとえば、種類、必要かどうか、デフォルト値... を設定することができます。

Vue.component('example', { 
    props: { 
    // basic type check (`null` means accept any type) 
    propA: Number, 
    // multiple possible types 
    propB: [String, Number], 
    // a required string 
    propC: { 
     type: String, 
     required: true 
    }, 
    // a number with default value 
    propD: { 
     type: Number, 
     default: 100 
    }, 
    // object/array defaults should be returned from a 
    // factory function 
    propE: { 
     type: Object, 
     default: function() { 
     return { message: 'hello' } 
     } 
    }, 
    // custom validator function 
    propF: { 
     validator: function (value) { 
     return value > 10 
     } 
    } 
    } 
}) 

ノート、Vue.jsもMULT受け入れること可能なタイプpropB: [String, Number],、それはあなたが必要なものです。 そしてそれについては、official wiki