Vue.js使用vue-moment出现非RFC2822/ISO日期格式告警如何解决

问题原因 #

你收到的弃用警告是因为原始日期格式2021-10-11 11:17:03不属于RFC2822或ISO 8601标准格式，moment默认会降级调用JS原生Date解析，跨浏览器兼容性差，因此触发告警。
你之前修改后报错有两个核心原因：

• 给vue-moment过滤器传入数组不符合语法规则，过滤器不支持数组作为输入值
• 你写的日期解析格式YYYY-MM-DD, h:mm:ss a和原始日期不匹配：原始日期没有逗号，是24小时制没有上午/下午标识，格式不匹配导致无法生成合法的moment对象。

修复方案 #

方案1：直接修正模板过滤器写法

将解析格式作为过滤器的最后一个参数传入即可，注意用匹配原始日期的格式字符串：

<small>{{ item.created_at | moment("from", "now", true, "YYYY-MM-DD HH:mm:ss") }}</small>

方案2：在方法中预解析（推荐，可维护性更高）

先在组件methods中定义日期处理方法：

methods: {
  getRelativeTime(dateStr) {
    return this.$moment(dateStr, "YYYY-MM-DD HH:mm:ss").fromNow(true)
  }
}

模板中直接调用方法：

<small>{{ getRelativeTime(item.created_at) }}</small>

内容的提问来源于stack exchange，提问作者Benny