Nativebase: Input loses focus when updating state.

Created on 29 Jun 2016 · 11Comments · Source: GeekyAnts/NativeBase

I am using React Naive 0.27.2 with nativebase 0.4.7, I am having trouble using the input component.

As you can see, I am trying to update the state on the input on onChangeText, but when I update the state the focus is lost from the input component. Is there another way to use the input component to get the value from it onSubmit?

edit:
Also TextInput is working correctly, if I substitute it for the input component.

`import {Container, Header, Content, Button, Title, List, ListItem, InputGroup, Input, Icon} from 'native-base';
import React, {Component} from 'react';
import {TextInput, View} from 'react-native';

export default class Login extends Component {

constructor() {
super();
this.state = {user: '', pw: undefined};
}

userNameUpdate(event){

  this.props.actions.createUser(this.state.username, '1234')
}


render() {
  const {login} = this.props

    return (
        <Container>

            <Content>

                    <InputGroup>
                           <Input
                             placeholder="USERNAME"
                             value={this.state.user}
                             onChangeText={(username) => this.setState({username})}/>
                           </InputGroup>

                       <InputGroup>
                           <Icon name="ios-unlock" />
                           <Input
                             placeholder="PASSWORD"
                             secureTextEntry={true}
                             value={(this.state && this.state.pw) || ''}
                             onChangeText={(password) => this.setState({pw: password})}/>
                       </InputGroup>


                   <Button style={{margin:5}} onPress={() => this.userNameUpdate()} block> Login </Button>


            </Content>


        </Container>
    );
}

}
`

bug

Source