Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6212

pass custom attribute to

$
0
0

I have a custom component that I have built using Native-base components like this:

export const FieldInput: React.FunctionComponent<FieldInputProps> = ({  handleChange,  handleBlur,  fieldType,  placeholderText,  value,  hidePassword,  hidePasswordIcon,  togglePassword,  icon,  style,}) => {  return (<Item rounded style={[styles.personalListItem, style]}><Icon name={icon} size={moderateScale(20)} color="green" /><Input        autoFocus={true}        autoCapitalize="none"        style={{ fontSize: moderateScale(15) }}        placeholder={placeholderText}        keyboardType="default"        onChangeText={handleChange(fieldType)}        onBlur={handleBlur(fieldType)}        value={value}        secureTextEntry={hidePassword}      />      {togglePassword ? (<Icon          name={hidePasswordIcon}          onPress={togglePassword}          style={commonStyles.iconStyle}          size={moderateScale(20)}          color="green"        />      ) : null}</Item>  );};

Here, the native base item has the property rounded. In most cases where I am using this component, I need it to be rounded. However, in one particular instance, I want to change it to a line. This is possible by simply removing the roundedword. But I am unable to modify the component accordingly. Currently, I am using this like this:

<FieldInput style={styles.fieldInput}                      handleChange={handleChange}                      handleBlur={handleBlur}                      value={values.phoneNumber}                      fieldType="phoneNumber"                      icon="phone"                      placeholderText="49152901820"                    />

Additionally, I couldn't find any proper documentation stating the keywords we can use for the shapes of . "line" doesn't work. Are there any other options?


Viewing all articles
Browse latest Browse all 6212

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>