React native 反应本机日期选择器相同大小的输入
如何使日期选择器的项目行与输入的大小相同React native 反应本机日期选择器相同大小的输入,react-native,native-base,React Native,Native Base,如何使日期选择器的项目行与输入的大小相同 ... import { Container, Header, Content, Card, Input, CardItem, Text, Right, Icon, Footer, FooterTab, Left, Body, Title, Button, Item } from 'native-base'; import DatePicker from 'react-native-datepicker'; ... <CardItem
...
import {
Container, Header, Content, Card, Input,
CardItem, Text, Right, Icon, Footer, FooterTab,
Left, Body, Title, Button, Item }
from 'native-base';
import DatePicker from 'react-native-datepicker';
...
<CardItem cardBody>
<Left>
<FontAwesome name="money" />
<Text>Rent Amount</Text>
</Left>
<Right>
<Item>
<Input
value={RentalAmount}
onChangeText={(text) => this.onChangeNumberFormat(text, 'RentalAmount')}
style={styles.valueText}
/>
</Item>
</Right>
</CardItem>
<CardItem cardBody>
<Left>
<FontAwesome name="calendar" />
<Text>Lease Start Date</Text>
</Left>
<Right>
<Item>
<DatePicker
date={LeaseStartDate}
mode="date"
placeholder="select date"
format="MM/DD/YYYY"
confirmBtnText="Confirm"
cancelBtnText="Cancel"
onDateChange={(text) => this.onChangeText(text, 'LeaseStartDate')}
customStyles={{
dateInput: {
borderWidth: 0,
alignItems: 'flex-start'
},
dateText: {
color: '#C0C0C0',
}
}}
/>
</Item>
</Right>
</CardItem>
。。。
进口{
容器、标题、内容、卡片、输入、,
卡片项、文本、右侧、图标、页脚、页脚选项卡、,
左侧,正文,标题,按钮,项目}
来自“本土基地”;
从“react native DatePicker”导入日期选择器;
...
租金金额
this.onChangeNumberFormat(文本'RentalAmount')}
style={style.valueText}
/>
租赁开始日期
this.onChangeText(文本'LeaseStartDate')}
自定义样式={{
日期输入:{
边框宽度:0,
alignItems:“灵活启动”
},
日期文本:{
颜色:'#C0C0',
}
}}
/>
如图所示,数据下的行比输入下的行短。如何使这些线的大小相同
谢谢您可以在
样式
道具中设置宽度,如下所示:
<DatePicker
style={{ width: 100 }}
date={LeaseStartDate}
...
/>
这条线不是设定好的吗?另外,行大小不应该在属性中自动设置吗?您使用的库与
本机库不同,有时其样式并不总是适用。如果我没有错的话,本机基址
有自己的
。您是否尝试过使用它来查看它是否与
组件配合良好?