antd使用问题

1.Ant Design 中的 <Input> 组件有两种不同的样式形态：带前缀和后缀的 <Input> 和普通的 <Input>。

带前缀和后缀的 <Input> 组件会由 <span class='ant-input-affix-wrapper'> 元素包裹，因此可以应用聚焦样式。而普通的 <Input> 组件则没有使用 <span class='ant-input-affix-wrapper'> 进行包裹。

在使用 Ant Design <Input> 组件时，如果你想要应用聚焦样式，可以考虑使用带前缀和后缀的 <Input> 组件，并在其中添加相应的前缀和后缀元素。

<Input
    className={styles.antdInput}
    placeholder="请输入手机号"
/>

.antdInput{
    border: 1px solid #d9d9d9;
    &:focus{
      border-color: #597ef7;
      box-shadow: 0 0 0 2px rgba(47, 84, 235, 0.2) !important;
    }
}