Как использовать относительное время dayjs

#momentjs #dayjs

#momentjs #dayjs

Вопрос:

Привет, ребята, у меня эта странная проблема при использовании относительного времени Dayjs

Ранее я использовал momentjs

 var date = "2021-02-26 16:04:15";
moment(date).fromNow();
 

Относительное время всегда будет увеличиваться, как и ожидалось

 20 minutes ago, then increase to 21 minutes ago, then increase to 22 minutes ago
 

Однако, когда я использую dayjs, относительное время не увеличивается. Он работает при загрузке страницы, но никогда не увеличивается

 import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';

var date = "2021-02-26 16:04:15";
dayjs(date).fromNow();
 

Вывод

 20 minutes ago, and never increase. Just static
 

Есть ли какая-либо конфигурация, которую я пропускаю, или dayjs не обеспечивает автоматическое обновление относительного времени?

Комментарии:

1. вы запускаете это в цикле или что-то в этом роде?

2. @DanCantir извините, если вывод вас смущает. Обновлено

3. Откуда вы знаете, что она не увеличивается? Я думаю, нам нужно больше кода. Кроме того, используете ли вы dayjs.extend(relativeTime) для расширения dayjs?

Ответ №1:

После моих исследований я считаю, что Day Js не имеет автоматического увеличения относительного времени по сравнению с MomentJS

Итак, мне просто нужно использовать setTimeout для автоматической отправки события каждые 60 секунд, содержащего последнюю временную метку.

И все места, которым требуется относительное время, будут уведомлены об обновлении состояния

Пример в Vue JS

app.js

 created() {

    let self = this;

    this.timer = setInterval(function () { self.$eventBus.$emit("updateTimeLabel", new Date()); }, 60000);

},
beforeDestroy() {
    clearInterval(this.timer)
}
 

timeLabel.vue

 props: {
    timestamp: {
      type: String,
      required: true,
    },
},
data() {
    return {
      from_now: null,
    };
},
created() {
    this.from_now = this.$fromNow(this.timestamp);

    // every one minute, app.js will emit event to update all TimeLabel.vue relative time

    this.$eventBus.$on("updateTimeLabel", (datetime) => {
      this.from_now = this.$fromNow(this.timestamp);
    });
},
methods: {

    $fromNow(timestamp) {
      return dayjs.utc(timestamp.substring(0, 23)).local().fromNow();
    },
}