React Native — Метка поверх ввода

#html #react-native #layout #label

Вопрос:

Я не мог найти, как добавить метку поверх ввода.

          <label > Constructor Name</label>
        <TextInput style={styles.inputs}></TextInput>
 

Когда я это делаю, это не объединяет. В отзывчивом стиле надпись и ввод будут разделять друг друга. Как я могу их приклеить?

Комментарии:

1. Каковы ваши требования? вы хотите, чтобы они были в одной линии? кроме того, вы должны использовать текст вместо метки

2. Почему текст для этикетки?

3. В React Native нет компонента метки

Ответ №1:

Вы можете создать отдельный компонент для ввода текста, например, отправить реквизит-заполнитель, и он покажет текст перед вводом текста.

 <View style={{}}>
  <Text style={{color: 'white', fontWeight: 'bold', fontSize: 15, marginBottom: 5}}>{props.placeholder}</Text>
  <TextInput
    mode="outlined"
    ref={textInput}
    label={props.label || 'Email'}
    secureTextEntry={secureTextEntry}
    onChangeText={(text) => setText(text)}
    returnKeyType={returnKeyType}
    onSubmitEditing={onSubmitEditing}
    multiline={multiline}
    keyboardType={keyboardType}
    value={text || value}
    style={[
      styles.inputStyle,
      inputStyle,
    ]}
  />
</View>
 

Комментарии:

1. Мне нужна метка поверх ввода. Текст помещается рядом с вводом.