vue中，使用vee-validate，如何传校验规则

Question

vue项目中，有以下父组件：

 <sku-batch-modify-modal placeholder="JD price" :rule="required|numeric"></sku-batch-modify-modal>

然后子组件中有内容：

  <input type="text" name="batchValue" :placeholder="placeholder" v-model="batchValue" :v-validate="rule"/>

子组件通过props接收校验vee-validate的规则，

props: {
    rule: {
    type: String,
    default: ''
    }
}

但是控制台报错：

[Vue warn]: Failed to resolve filter: numeric
[Vue warn]: Property or method "required" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property.

请问怎么传递vee-validate的校验规则？

Answer 1

首先，父组件：
<sku-batch-modify-modal placeholder="JD price" rule="required|numeric"></sku-batch-modify-modal>
然后，子组件：

<input type="text" name="batchValue" :placeholder="placeholder" v-model="batchValue" v-validate="rule"/>

Answer 2

1. 将校验规则定义一个方法，通过方法来传递；
2. 参考：Vue如何使用vee-validate表单验证

Answer 3

required|numeric再用个单引号包起来试试

:rule="'required|numeric'"

有个疑问为什么不直接在组件里用呢？