React Native - 输入顶部的标签

Question

我找不到如何在输入顶部添加标签。

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

当我这样做的时候它并没有团结起来。在响应式风格中，标签和输入将彼此分开。我怎样才能坚持下去？

Answer 1

您可以像这样为文本输入制作单独的组件发送 placeholder 属性，它会在 textInput 之前显示文本。

<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>

React Native - 输入顶部的标签

React Native - Label on top of Input

html

layout

label

react-native