如何字符串拼接时区

Question

我使用react native模态日期时间选择器来选择日期，它运行良好。例如，当我选择一个日期时，我会得到这样的东西：Mon Nov 05 2018 14:35:47 GMT+0900 (Korean Standard Time)

但是我得到了不必要的值，所以我想使用string.splice或subString剪切到Nov 05 2018 14:35。

以下是我的代码：

import DateTimePicker from 'react-native-modal-datetime-picker';
class InfoScreen extends Component{
constructor(props){
super(props)
this.state={
datePick:'',
}
}
_showDateTimePicker = () => this.setState({ isDateTimePickerVisible: true })
_hideDateTimePicker = () => this.setState({ isDateTimePickerVisible: false })
_handleDatePicked = (date) => {
console.log('A date has been picked: ', date);
this._hideDateTimePicker()
this.setState({
datePick:date
})
}
render(){
return(
<View>
<TouchableOpacity onPress = {() => {this._showDateTimePicker()}}>
<Text style={{color:'gray',paddingTop:3, marginLeft:5}}> 
//Here I get something like: Mon Nov 05 2018 14:35:47 GMT+0900 (Korean Standard Time)
{this.state.datePick.toString()}</Text>
</TouchableOpacity>
<DateTimePicker
isVisible={this.state.isDateTimePickerVisible}
onConfirm={this._handleDatePicked}
onCancel={this._hideDateTimePicker}
/>

<Text> //I want to get new value here. Something like: Nov 05 2018 14:35
{this.state.datePick.slice(4,7)}
</Text>
</View>
)
}
}

我使用了{this.state.datePick.slice(4,7)}，但没有工作。知道为什么吗？

Answer 1

使用slice(4,7)意味着您将获得从第4个索引到第6个索引的子字符串。此外，Date对象没有slice方法，所以必须先将其转换为字符串。使用this.state.datePick.toString().slice(4,21)获取与Nov 05 2018 14:35格式相同的字符串，或者使用this.state.datePick.toString().slice(4,24)获取秒数。

Answer 2

使用moment包来格式化日期，而不是按照我们的意愿对其进行切片，这也不是最好的方法。

npm install moment --save

欲了解更多信息，请访问https://momentjs.com/docs/

import Moment from 'moment';
{Moment(this.state.chosenDate).format('MMM DD YYYY HH:mm')}

为了展示它的工作原理，我使用DatePickerIOS。

import React, { Component } from 'react'
import {
DatePickerIOS,
View,
StyleSheet,
Text,
} from 'react-native'
import Moment from 'moment';
export default class App extends Component {
constructor(props) {
super(props);
this.state = { chosenDate: new Date() };
this.setDate = this.setDate.bind(this);
}
setDate(newDate) {
this.setState({chosenDate: newDate})
}
render() {
return (
<View style={styles.container}>
<DatePickerIOS
date={this.state.chosenDate}
onDateChange={this.setDate}
/>
<Text>
{Moment(this.state.chosenDate).format('MMM DD YYYY HH:mm')}
</Text>
</View>
)
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center'
},
})
//Nov 05 2018 14:35

Answer 3

这是一个很晚的答案，但

toDateString()

他仍在等待答案。