react-native - 我想在反应原生 dateTimePicker 中显示选定的日期和时间
问题描述
我是新来的反应本地人。我想在日期按钮下方显示我选择的日期和时间,在时间按钮下方显示时间。现在在下面的代码中,我只是调整我的日期和时间并保存它。但我想在屏幕上显示我选择的日期和时间。这是我的代码。请帮忙。谢谢
import React, {Component} from 'react';
import {View, Button, Platform} from 'react-native';
import DateTimePicker from '@react-native-community/datetimepicker';
export default class App extends Component {
state = {
date: new Date('2020-06-12T14:42:42'),
mode: 'date',
show: false,
}
setDate = (event, date) => {
date = date || this.state.date;
this.setState({
show: Platform.OS === 'ios' ? true : false,
date,
});
}
show = mode => {
this.setState({
show: true,
mode,
});
}
datepicker = () => {
this.show('date');
}
timepicker = () => {
this.show('time');
}
render() {
const { show, date, mode } = this.state;
return (
<View>
<View>
<Button onPress={this.datepicker} title="Show date picker!" />
</View>
<View>
<Button onPress={this.timepicker} title="Show time picker!" />
</View>
{ show && <DateTimePicker value={date}
mode={mode}
is24Hour={true}
display="default"
onChange={this.setDate} />
}
</View>
);
}
}
解决方案
显示它的一种简单方法是添加
<Text>A simple view of dateTime: {String(this.state.date)}</Text>
推荐阅读
- devise - rails devsie_ldp 如何忽略证书验证?
- api - 如果 CORS 标头“Access-Control-Allow-Origin”为“*”且 CORS 请求未成功,则不支持凭据
- ios - 如何使用数组方法在模型中添加多个项目?
- java - 是否可以将kafka消费者寻找到主题分区的开头并再次轮询所有记录
- python - 将 url 从浏览器拖放到文本字段(tkinter 或 kivy)
- hyperledger-fabric - 事务处理器功能 - 我如何知道何时提交/认可数据
- python - 在列表列表中查找最常见的元素
- react-native - React Native 和 Redux Persist 不将状态保存到持久存储
- java - 使用 Java 8 流 API 将列表扁平化为列表
- xml - Xpath 意外输出