N-Form-Item 自定义验证规则 - 如何在 NForm 中添加自定义验证

您可以使用 N-Form-Item 组件的'rules' 属性来自定义验证规则。该属性接受一个数组，每个元素代表一个验证规则。

例如，您可以在'rules' 属性中定义一个自定义的验证规则来验证输入内容是否为数字：

<n-form-item label='数字' prop='number'>
  <n-input v-model='number'></n-input>
</n-form-item>

data() {
  return {
    number: ''
  }
},

rules: {
  number: [
    { required: true, message: '请输入数字', trigger: 'blur' },
    { validator: this.validateNumber, trigger: 'blur' }
  ]
},
methods: {
  validateNumber(rule, value, callback) {
    if (!value) {
      callback(new Error('请输入数字'));
    } else if (!Number.isInteger(Number(value))) {
      callback(new Error('请输入整数'));
    } else {
      callback();
    }  
  }
}

在上面的例子中，我们首先定义了一个'number' 的数据属性来保存输入的内容。然后，在'rules' 属性中定义了一个验证规则，使用'validator' 属性指定了一个自定义的验证函数'validateNumber'。该函数接受三个参数：验证规则对象、输入的值和回调函数。在函数中，我们首先判断输入的值是否为空，如果为空则调用回调函数传入一个错误信息；否则，判断输入的值是否为整数，如果不是则调用回调函数传入一个错误信息；如果都符合条件，则调用回调函数不传入任何参数，表示验证通过。

注意，自定义验证函数中的'this' 指向的是当前组件实例，所以需要使用箭头函数或者在使用'validator' 属性时绑定函数的上下文。

更多关于 N-Form-Item 组件的验证规则设置请参考官方文档。