使用react hook表单验证具有不同索引的多个字段

Question

我试图验证一些字段都是我的字段数组的一部分。它们有相同的名称，但是它们有不同的数组索引。

<Select
{...register(`documents.${index}.language`, {
validate: (v) => getValues(v),
})}
sx={{ textAlign: 'center' }}
>
{availableLanguages
?.sort((a) => (a.name === 'pl' ? -1 : 1))
// sorting so pl is default value
.map((language) => (
<option key={language.name} value={language.name}>
{language.name.toUpperCase()}
</option>
))}
</Select>

我想通过获取所有的语言值来验证，并检查它们是否都是唯一的。

输出数组为用户决定填充的每个字段创建一个对象，并在该对象中返回一个语言值和其他一些值。

[{语言:"en"},{语言:"en"},{语言:"溴"}]

我想验证这个，最好在提交之前，这意味着它必须在字段的validate函数中完成。

另一种方法，我也可以在提交时验证它，但是我也不确定如何有效地做到这一点。

Answer 1

对于将来的任何人，这是我能够绕过此验证的方式。一个简单的for循环，还有其他方法，但它们不会主动获取字段值，除非保持在状态。

<Select
{...register(`documents.${index}.language`, {
validate: (v) => {
for (let x = 0; x < index; x++) {
if (v === getValues(`documents.${x}.language`)) return false;
}
},
})}
sx={{ textAlign: 'center' }}
>
{sortLanguages(availableLanguages).map((language) => (
<option key={language.name as string} value={language.name as string}>
{language.name.toUpperCase()}
</option>
))}
</Select>