shoutem/ui

TextInput Crush constantly after add react-redux to the project

ansoncen opened this issue · 0 comments

My working environment is MacOS and using the react-native run-ios

I current met a problem with the TextInput. everything works fine until I add the redux code (actions, reducer) to the project. Every time I input some text, click on another Input and click back on the previous input, the application will turn into black, crash and return to the home screen without any error logs shown.

Eventually I found the problem is the from the '@shoutem/ui'. After I using the react-native , the problem disappears.

here is the code for my TextInput component

import React from 'react';
import { TextInput, View, Icon } from '@shoutem/ui';
// import { TextInput, View } from 'react-native';

const Input = ({ placeholder, secureTextEntry, iconName, onChangeText, value }) => {
  return (
    <View style={styles.inputStyle}>
      <Icon name={iconName} />
      <TextInput
        secureTextEntry={secureTextEntry}
        style={styles.textInputStyle}
        placeholder={placeholder}
        autoCapitalize='none'
        value={value}
        onChangeText={onChangeText}
        autoCorrect={false}
      />
    </View>
  );
};

const styles = {
  inputStyle: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'flex-start',
    marginLeft: 50,
    marginRight: 50,
  },
  textInputStyle: {
    backgroundColor: null,
  }
};

export { Input };

And the part of the code for the text input form

<View>
            <Input
              placeholder='Username'
              iconName='user-profile'
              onChangeText={this.onUsernameChanged.bind(this)}
              value={this.props.username}
            />
            <Input
              placeholder='Password'
              iconName='lock'
              secureTextEntry
              onChangeText={this.onPasswordChanged.bind(this)}
              value={this.props.password}
            />
</View>