所以在我的render（）函数中，我有一个开关，可以根据类型有条件地加载不同的组件，问题是，在其中一种情况下，我不得不渲染2个组件，因此我将它们包装在div中因此他们会丢失分配给他们的课程inputField，这就是代码的样子：

{(() => {
                switch (values.type) {
                  case "sole":
                    return (
                      <div>
                        <InputMask
                          classname={classnames(
                            styles.inputField,styles.override
                          )}
                        >
                          {() => (
                            <LNTextField
                              type="text"
                            />
                          )}
                        </InputMask>
                        <InputMask
                          classname={classnames(
                            styles.inputField,styles.override
                          )}
                        >
                          {() => (
                            <LNTextField
                              name="dob"
                              type="text"
                            />
                          )}
                        </InputMask>
                      </div>
                    );
                  default:
                    return null;
                }
              })()}

由于这是一个样式问题，因此我删除了代码的许多功能位，为什么InputMask现在位于div中，为什么没有应用inputField类，又该如何解决呢？ / p>

这是样式的外观，我使用覆盖来增加优先级；

.inputField.override {
  margin-top: 2.5%;
  margin-bottom: 2.5%;
}