我正在尝试验证三个字段之一的初始状态值已更改。如果没有任何更改,则引发错误。字段之一是图像,因此我正在使用隐藏字段在提交时存储图像数据。我是Yup的新手,所以仍然想尝试在这个地方走走的路。我已经尝试了很多事情,尽管无法正常工作。我现在遇到了周期性依赖问题。任何帮助或指导都非常感谢。
SignupSchema = Yup.object().shape({
hidden: Yup.mixed().when(['tagText', 'tagName'], {
is: (tagText, tagName) => !tagText && !tagName,
then: Yup.string().test('anything-different-one', 'There are no changes to save, please make sure you have changed at least one field', (value) => {
if (value === undefined) return true;
if (this.state.initialFaceSelected.unified !== value.hidden.unified) return true;
return false;
})
})
.required("Please select an emoji first!"),
tagName: Yup.string().when(['tagText', 'hidden'], {
is: (tagText, hidden) => !tagText && !hidden,
then: Yup.string().test('anything-different-two', 'There are no changes to save, please make sure you have changed at least one field', (value) => {
if (value === undefined) return true;
if (this.state.initialFaceSelected.tagName !== value.tagName) return true;
return false;
})
})
.min(2, "Too Short!")
.max(15, "Too Long!")
.test('value-name-exists', '${value} tag name already exists, please choose another', (value) => {
if (value === undefined) return true;
let valLower = this.props.tags.data.map((tag) => {
return tag.tagName.toLowerCase();
});
let valValue = valLower.map((tag) => {
return tag === value.toLowerCase()
});
if (valValue.indexOf(true) >= 0 && value !== this.initialValues.tagName) return false;
return true;
})
.required("Required"),
tagText: Yup.string().when(['hidden', 'tagName'], {
is: (hidden, tagName) => !hidden && !tagName,
then: Yup.string().test('anything-different-three', 'There are no changes to save, please make sure you have changed at least one field', (value) => {
if (value === undefined) return true;
if (this.state.initialFaceSelected.tagText !== value.tagText) return true;
return false;
})
})
.test('value-text-exists', '${value} tag text already exists, please choose another', (value) => {
if (value === undefined) return true;
let valLower = this.props.tags.data.map((tag) => {
return tag.tagText.toLowerCase();
});
let valValue = valLower.map((tag) => {
return tag === value.toLowerCase()
});
if (valValue.indexOf(true) >= 0 && value !== this.initialValues.tagText) return false;
return true;
})
.min(2, "Too Short!")
.max(15, "Too Long!")
.required("Required")
},[['tagName', 'tagText'], ['tagText', 'hidden'], ['hidden', 'tagName']]);