为什么toLocaleDateString无法在react-native（Android）中工作？

Question

出于某些奇怪的原因，toLocaleDateString在本机状态下无法正常工作。有时它起作用，有时却不起作用。对于以下代码，

const dateString = this.state.date.toLocaleDateString('en-US', {
            weekday: 'short',
            day: 'numeric',
            month: 'long',
            year: 'numeric',
        });

有时我只会得到07/17/2018，有时会得到常规输出。现在，我可以自己实现它，也可以使用moment.js或类似的东西。我想知道为什么会这样。

Answer 1

React Native在非调试模式下使用JavaScriptCore引擎，它不能很好地与日期配合使用，但可以在调试期间使用，因为它在调试时使用chrome V8引擎。

因此，最好使用moment或XDate JavaScript库。

Answer 2

SDushan是正确的。最好使用moment或XDate。

但是我选择纠正一个小的功能，而不是导入完整的库。

function getDateString(date) {
    if (Platform.OS === 'ios')
        return date.toLocaleDateString('en-US', {
            weekday: 'short',
            day: 'numeric',
            month: 'long',
            year: 'numeric',
        });
    else {

        var
            dayOfWeek = ["Mon", "Tue", "Wed", "Thur", "Fri", "Sat", "Sun"],
            monthName = ["January", "February", "March", "April", "May", "June",
                         "July", "August", "September", "October", "November", "December"],
            utc = date.getTime() + date.getTimezoneOffset() * 60000,
            US_time = utc + (3600000 * -4),
            US_date = new Date(US_time);

        return dayOfWeek[US_date.getDay()-1] + ", " + monthName[US_date.getMonth()] +
               " " + US_date.getDate() + ", " + US_date.getFullYear();
    }
}

Answer 3

我用过像SDushan这样的时刻，这是一个示例：

import i18n from '../i18n';

const moment = require('moment');

moment.locale('es', {
  months : 'enero_febrero_marzo_abril_mayo_junio_julio_agosto_septiembre_octubre_noviembre_diciembre'.split('_'),
  weekdays : 'domingo_lunes_martes_miercoles_jueves_viernes_sábado'.split('_'),
  relativeTime : {
      future : 'dentro de %s',
      past : 'hace %s',
      s : 'algunos segundos',
      m : 'un minuto',
      mm : '%d minutos',
      h : 'una hora',
      hh : '%d horas',
      d : 'un día',
      dd : '%d días',
      M : 'un mes',
      MM : '%d meses',
      y : 'un año',
      yy : '%d años'
  }
});

export const translateDate = date => {
    const currentLanguage = i18n.language;
    moment.locale(currentLanguage); // or moment.locale('es')
    const dateString = moment(date).format('dddd Do MMMM, YYYY');
    return dateString.charAt(0).toUpperCase() + dateString.slice(1)
}

然后您可以在组件中使用它：

<View style={Styles().containerDate}>
     <Input
          inputContainerStyle={Styles().inputContainerStyle}
          inputStyle={Styles().inputText}
          editable={false}
          label={i18n.t(`${i18nConfinement}.startdate`)}
          placeholderTextColor={Styles().placeholder.color}
          value={translateDate(startDate)}
      />
      <Icon onPress={() => setShowStartDate(!showStartDate)} size={25} name={showStartDate ? 'calendar-check-o' : 'calendar'} color={Styles().icon.color} type='font-awesome' />
 </View>

Here是有关如何使用moment.js管理日期的文章

最终结果：