Как сделать string.splice часовой пояс

Question

Я использую response-native-modal-datetime-picker , чтобы выбрать дату, и она отлично работает. Например, когда я выбираю дату, я получаю что-то вроде этого: Mon Nov 05 2018 14:35:47 GMT+0900 (Korean Standard Time)

Но я получаю ненужные значения, поэтому хочу сократить до Nov 05 2018 14:35, используя string.splice или subString.

Ниже мой код:

    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

Используйте пакет 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 2

Использование 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), чтобы получить количество секунд.