使用样式化组件扩展 React Bootstrap Form.Control - React

问题描述

如标题所述，我正在扩展 React Bootstrap Form.Control 组件。这是您可以设置值、名称和 onClick 事件的组件。

不幸的是，当我使用以下代码扩展 Form.Control 时，我失去了表单功能。看起来像是 Form.Control 组件的背景中的某些东西，它有助于 React Bootstrap 表单的功能。当我使用 Form.Control 时，表单提交有效，当我使用“StyledForm.Control”时，它不起作用。帮助！

const StyledInputWrapper = styled(Form.Control)
   max-width: 350px;
   min-width: 250px;
   height: 40px;
   border: none;
   margin: 0.5rem 0;
   background-color: #f5f5f5;
   Box-shadow: 0px 14px 9px -15px rgba(0,0.25);
   border-radius: 8px;
   padding: 0 1rem;
   transition: all 0.2s ease-in;
   z-index: 9999;
   &:hover {
    transform: translateY(-3px);
   }`;

const Input = () => {
  return (
    <Container>
      <StyledInputWrapper required />
      <InputColorCircles />
    </Container>
  );
};

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）