道具输入的Reactjs最大宽度(使用样式化组件)

时间:2020-09-10 21:01:59

标签: reactjs antd styled-components

我有一个使用样式化组件样式化的输入(antd)。问题是我无法使用props更新最大宽度。这是代码

 const TextInput = styled(Input)`
  border: 2px solid #edf4ff;
  border-radius: 15px;
  width: ${(props) => props.width};
  max-width: ${(props) => props.maxWidth};
  min-width: ${(props) => props.minWidth};
  height: 64px;
  background-color: ${(props) => props.backgroundColor};
  &:active,
  &:focus,
  &:-internal-autofill-selected {
    background-color: white !important;
    margin-left: 17px;
  }
`;

1 个答案:

答案 0 :(得分:0)

您需要将maxWidth作为道具传递给样式为TextInput的

<TextInput maxWidth={'500px'}>ABC</TextInput>