我正在创建基于React的应用程序，并使用Yup进行验证。但是，验证时出现Cyclic Dependency错误。

• • 说明：**用户将看到两个颜色下拉列表，如下图所示。默认情况下，两个下拉列表都将选择White。
• • 注意**默认情况下，页面加载时，White - White为给定选项。此选择有效。
• • 场景：**用户即将开始绘图，现在他们正在从下拉列表中选择颜色。
• • 示例：**

1.白色-白色：* * 好的**
1.白色-红色：* * 错误：（您必须选择其他颜色，不能在第一个下拉列表中选择白色）
1.红色-白色：* * 错误：（您必须选择其他颜色，不能在第二个下拉列表中选择白色）
1.红色-红色：* * 错误：（不能为两个下拉列表选择除白色之外的两种相同颜色）
1.红色-绿色：* * 好的
1.绿色-红色：* * 好的**
1.黄色-红色：* * 好的**
1.黄色-白色：* * 错误**（您必须选择其他颜色，不能在第二个下拉列表中选择白色）
我正在尝试开始第一次验证，但似乎有一个Cyclic Dependency的问题。我将感谢您的帮助。谢谢。

FirstColorDDL:""
SecondColorDDL:""

const Color = () => {
    return Yup.object().shape({
        FirstColorDDL: Yup.string()
            .required('Please Choose any Color !!'),
            .when("SecondColorDDL", {
            is: (SecondColorDDL) => SecondColorDDL && SecondColorDDL == "White",
            then: Yup.string().required("You must select other color, cannot select white in 2nd drop down")
            }),
        SecondColorDDL: Yup.string()
            .required('Please Choose any Color !!'),
            .when("FirstColorDDL", {
            is: (FirstColorDDL) => !FirstColorDDL|| FirstColorDDL.contains("White"),
            then: Yup.string().required("You must select other color, cannot select white in 1st drop down")
         })

    })