JavaScript/React中转换yyyy-mm-ddTHH:mm:ssZ日期为dd-mm-yyyy是否需用库？

完全不需要依赖第三方库，用原生JavaScript就能轻松完成这个转换，这里提供两种实用方法：

方法一：利用原生Date对象解析处理 #

通过Date对象解析API返回的日期字符串，再提取日、月、年信息并拼接成目标格式，同时处理个位数补零的问题：

function formatDate(apiDate) {
  const date = new Date(apiDate);
  // 补零确保日/月是两位数
  const day = String(date.getDate()).padStart(2, '0');
  // 月份从0开始，所以要加1
  const month = String(date.getMonth() + 1).padStart(2, '0');
  const year = date.getFullYear();
  return `${day}-${month}-${year}`;
}

// 调用示例
const apiDate = "2024-05-20T14:30:00Z";
console.log(formatDate(apiDate)); // 输出 "20-05-2024"

方法二：直接字符串分割重组 #

因为API返回的日期格式非常固定，也可以直接拆分字符串来重组，这种方法更高效，不需要解析日期：

function formatDate(apiDate) {
  // 提取T之前的日期部分（yyyy-mm-dd）
  const dateSegment = apiDate.split('T')[0];
  // 拆成年、月、日数组
  const [year, month, day] = dateSegment.split('-');
  // 按dd-mm-yyyy顺序拼接
  return `${day}-${month}-${year}`;
}

// 调用示例
const apiDate = "2024-05-20T14:30:00Z";
console.log(formatDate(apiDate)); // 输出 "20-05-2024"

两种方法的适用场景 #

• 字符串分割法：适合你能确定API返回的日期格式永远是yyyy-mm-ddTHH:mm:ssZ的场景，执行效率更高。
• Date对象法：如果后续需要对日期做更多操作（比如加减天数），或者担心日期格式可能有细微变化，用这种方法更稳妥。

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