禁用 Search.Input 按钮 and.design

Question

我需要禁用搜索组件中的按钮。如果输入为空且电子邮件无效，请禁用它。我找不到实现这一目标的解决方案，如果之前有人这样做过，请提供帮助。 enter 按钮仅显示 true 或 false 按钮，但没有属性禁用 is。

 <Search
   value={this.state.email}
   style={{width: '450px', marginTop: '20px',}}
   placeholder={t('emailPlaceHolder')}
   enterButton={t('submit')}
   onSearch={this.handleSubmitEmail}
   onChange={this.handleEmailChange}
 />

提前谢谢大家

Answer 1

搜索组件有一个属性，名为 enterButton，它可以是布尔值，也可以是 React 组件。您可以使用一个简单的功能组件来替换它为您提供的按钮，您可以自己将道具传递给该按钮。

<Search
  enterButton={() => <MyEnterButtonComponent disabled={myEmailValidationFunction} />
/>

This 是搜索组件的 API。

禁用 Search.Input 按钮 and.design

Disabled Search.Input button and.design

javascript

reactjs

ant-design-pro