设置 NativeBase 输入的样式

Question

我想更改输入的边框大小、颜色等。出于某种原因，当我将 2 个输入堆叠在一起时，我将 marginTop 添加到下面的输入，或者尝试调整输入的大小，然后将它们居中在页面中，左侧或底部的边框消失。

<View style={styles.formAlign}>
    <Item regular style={styles.email}>
        <Input placeholder='Email' />
     </Item>
     <Item regular style={styles.password}>
         <Input placeholder='Password' />
     </Item>
</View>





email:{
   borderWidth:4,
   color:'red'
},
password:{

},
formAlign:{
    justifyContent:'center',
    alignItems:'center'
},

Answer 1

尝试了你的代码，修改了一下

import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native'
import { Item, Input } from 'native-base';

export default class App extends Component {

  render() {
    return (
      <View style={styles.formAlign}>
        <Item style={styles.email}>
          <Input placeholder='Email' style={styles.input} />
        </Item>
        <Item style={styles.password}>
          <Input placeholder='Password' style={styles.input} />
        </Item>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  email: {
    width: 300,
  },
  password: {
    width: 300,
    marginTop: 15,
  },
  formAlign: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  input: {
    borderWidth: 1,
    borderColor: 'blue'
  }
});

得到这个结果