React native 文本本机视图中的输入边框和宽度

我有一个react native视图，其中包含以下内容：

<View style={styles.section}>
          <Text style={styles.h2}>
            NAME
          </Text>
          <TextInput style={styles.input} placeholder="Name" />
          <Text style={styles.h2}>
            EMAIL
          </Text>
          <TextInput style={styles.input} placeholder="Password" />
        </View>  

input: {
    height: 30,
    flex: 0.7,
    fontSize: 13,
    padding: 4,
    borderBottomColor: '#fff',
    borderRightColor: 'transparent',
    borderLeftColor: 'transparent',
    borderTopColor: 'transparent',
    borderTopWidth: 0,
    borderBottomWidth: 0.5,
  },

名称
电子邮件
输入：{
身高：30，
弹性系数：0.7，
尺寸：13，
填充：4，
borderBottomColor:“#fff”，
borderRightColor:“透明”，
borderLeftColor:'透明'，
borderTopColor:'透明'，
borderTopWidth:0，
边框底部宽度：0.5，
},

---

不幸的是，这没有显示边框（而不是所需的下划线边框），两个输入框占据了整个屏幕（而不是我想要的0.7 flex）。我该如何解决这个问题

除非启用了多行功能，否则无法直接在TextInput上声明特定边框。您可以签出该功能

我将文本输入包装在一个视图中，然后在视图中添加一个边框，在您的情况下，您不希望文本输入是全宽的，我只是在左侧和右侧添加一个边距

将TextInput包装到视图中：

<View style={styles.section}>
           <Text style={styles.h2}>
             NAME
           </Text>
           <View style={styles.inputView}>
            <TextInput style={styles.input} placeholder="Name" />
           </View>
           <Text style={styles.h2}>
             EMAIL
           </Text>
           <View style={styles.inputView}>
              <TextInput style={styles.input} placeholder="Password" />
           </View>
</View>

---

用视图包装文本输入，并为其指定输入样式（fontSize除外）

input: {
  height: 40,
  fontSize: 13,
  padding: 4,
},
section:{
  marginLeft:10,
  marginRight:10,
},
inputView:{
  borderBottomColor: '#fff',
  borderBottomWidth: 0.5,
}