Как отобразить дату в правильном порядке?(Реагируй Родной) - PullRequest
0 голосов
/ 11 июля 2019

В моем мобильном приложении я делюсь списком своих каналов на Youtube.Под моими видео на Youtube дата не отображается в правильном формате (отображается следующий формат: месяц / день / год).

Как отобразить его во французском формате (день / месяц / год)?

const VideoListItem = ({ data, onVideoPress }) => {
  return (
    <TouchableOpacity onPress={() => onVideoPress(data)}>
      <View style={styles.container}>
        <CachedImage
          uri={data.artworkUrlHigh.url}
          style={styles.flexMax}
          imageStyle={styles.cover}
        />
        <View style={styles.textContainer}>
          <View style={styles.flexMax}>
            <Text style={styles.text} numberOfLines={2} ellipsizeMode="tail">
              {decode(data.title)}
            </Text>
           
          </View>
          <Text style={styles.textAlt}>
            Publié le{' '}
            {new Date(parseInt(data.publishedAt, 10)).toLocaleDateString('fr-FR', { timezone: 'UTC' })}
          </Text>
        </View>
      </View>
    </TouchableOpacity>
  );
};

Заранее спасибо.

Ответы [ 2 ]

1 голос
/ 11 июля 2019

Какой браузер?

Chrome показывает сегодня и сегодня по-французски

var data = {}
data.publishedAt = "1562848984568";
console.log(
  new Date(+data.publishedAt).toLocaleDateString('fr-FR', { timezone: 'UTC' })
)
// US for comparison
console.log(
  new Date(+data.publishedAt).toLocaleDateString('en-US', { timezone: 'UTC' })
)

Параметры и локали на мобильных устройствах широко не поддерживаются

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleDateString#Browser_compatibility

enter image description here


Intl.DateTimeFormat может работать лучше

var data = {}
data.publishedAt = "1562848984568";
var date = new Intl.DateTimeFormat('fr-FR').format(+data.publishedAt)
console.log(date)

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat#Browser_compatibility

enter image description here

Верная версия:

var pad = function(num) { return ("0"+num).slice(-2) }
var format = function(dateString) { 
  var date = new Date(+dateString);
  return pad(date.getDate())+"/"+pad(date.getMonth()+1)+"/"+date.getFullYear();
}

// test:
var data = {}
data.publishedAt = "1562848984568";
console.log(format(data.publishedAt))
// end test

/* 
used like this:

<Text style={styles.textAlt}>Publié le {format(data.publishedAt)}</Text>

*/
0 голосов
/ 11 июля 2019

вы пробовали moment.js ?реализация проста

moment(data.publishedAt).format('DD/MM/YYYY')

так в вашем коде

import moment from 'moment'

const VideoListItem = ({ data, onVideoPress }) => {
  return (
    <TouchableOpacity onPress={() => onVideoPress(data)}>
      <View style={styles.container}>
        <CachedImage
          uri={data.artworkUrlHigh.url}
          style={styles.flexMax}
          imageStyle={styles.cover}
        />
        <View style={styles.textContainer}>
          <View style={styles.flexMax}>
            <Text style={styles.text} numberOfLines={2} ellipsizeMode="tail">
              {decode(data.title)}
            </Text>

          </View>
          <Text style={styles.textAlt}>
            Publié le{' '}
            {moment(data.publishedAt).format('DD/MM/YYYY')} <-- this line
          </Text>
        </View>
      </View>
    </TouchableOpacity>
  );
};
...