本机库动态显示成功或错误输入

问题描述 投票:2回答:2

我想要两个简单的输入框。

有一个loginName输入框和一个密码输入框。

目前,我将这两个输入框的值映射为“状态”。

现在,使用NativeBase。如何动态显示“成功”“错误”,就像他们在演示中所做的那样? http://nativebase.io/docs/v0.5.9/components#successInputTextbox

reactjs react-native native-base
2个回答
5
投票

通过道具success相当于通过success={true}

因此,如果您有状态变量,如inputSuccess和inputError,您可以这样做:

<InputGroup 
  iconRight 
  success={this.state.inputSuccess ? true : false} 
  error={this.state.inputError ? true : false}>
  <Icon name='ios-checkmark-circle' style={{color:'#00C497'}}/>
  <Input placeholder='Textbox'/>
</InputGroup>

0
投票

Native Base文档(版本2.12)有this example

state = { error: 'Some error' };
// ...
<Content>
  <Item error={this.state.error !== ''}>
    <Input 
      placeholder='Textbox with Error Input'
      error={'#d50000'}
    />
    <Icon name='close-circle' />
  </Item>
</Content>

<Input />中的错误道具是设置错误颜色。无效状态在项目错误道具处设置。

© www.soinside.com 2019 - 2024. All rights reserved.