SolvedNativeBase Floating Label with Error

I am trying to display the red underline error with the red cross icon shown here https://docs.nativebase.io/Components.html#error-textbox-headref with the floating Label shown here https://docs.nativebase.io/Components.html#floating-label-headref.

<Item floatingLabel> <Label>Username</Label> <Input /> </Item>

How do I add the error prop "error" to Item conditionally? <Item error>

Thanks.

<Item floatingLabel error> <Label>{field.placeholder}</Label> <Input className="form-control" type={field.type} {...input} disabled={disabled} /> {touched ? <Icon name='close-circle' style={styles.error} /> : <Text />} </Item>

I tried this but the red line is always showing and the icon is on the left side of the text

14 Answers

✔️Accepted Answer

Until this issue is closed you can put the icon on the right with style.

<Item style={{ flexDirection: 'row-reverse' }} >

Other Answers:

Using 2.8.1 and having the same issue

More Issues: