UTC時(shí)間格式是什么

首先我們先簡單的了解一下：UTC時(shí)間（協(xié)調(diào)世界時(shí)，Coordinated Universal Time）使用24小時(shí)制，以小時(shí)、分鐘、秒和毫秒來表示時(shí)間

HH:mm:ss.SSS

• HH 表示小時(shí)，取值范圍為00到23。
• mm 表示分鐘，取值范圍為00到59。
• ss 表示秒，取值范圍為00到59。
• SSS 表示毫秒，取值范圍為000到999。

需要注意的是，UTC時(shí)間不考慮夏令時(shí)或時(shí)區(qū)的影響，因此它是一種標(biāo)準(zhǔn)的時(shí)間表示方法，不會(huì)受到地理位置的變化而改變。

如何轉(zhuǎn)化呢？

我們先隨便準(zhǔn)備一組數(shù)據(jù)，能用就行哈

假設(shè)下方的數(shù)據(jù)就是我們沖接口中獲取到的

				list: [{
						"id": 20,
						"goods_id": 20,
						"task_id": null,
						"deduct_num": 120,
						"integral_num": null,
						"type": 2,
						"created_at": "2023-08-31T02:56:02.000000Z"
					},
					{
						"id": 19,
						"goods_id": 29,
						"task_id": null,
						"deduct_num": 60,
						"integral_num": null,
						"type": 2,
						"created_at": "2023-08-31T02:55:44.000000Z"
					},
					{
						"id": 18,
						"goods_id": 12,
						"task_id": null,
						"deduct_num": 60,
						"integral_num": null,
						"type": 2,
						"created_at": "2023-08-31T02:41:32.000000Z"
					},
					{
						"id": 17,
						"goods_id": 9,
						"task_id": null,
						"deduct_num": 220,
						"integral_num": null,
						"type": 2,
						"created_at": "2023-08-31T02:23:40.000000Z"
					},
					{
						"id": 16,
						"goods_id": 25,
						"task_id": null,
						"deduct_num": 40,
						"integral_num": null,
						"type": 2,
						"created_at": "2023-08-31T02:18:09.000000Z"
					},
					{
						"id": 15,
						"goods_id": 30,
						"task_id": null,
						"deduct_num": 160,
						"integral_num": null,
						"type": 2,
						"created_at": "2023-08-31T01:15:15.000000Z"
					}
				],

使用v-for指令遍歷list數(shù)組，然后調(diào)用convertUTCtoLocal方法將每個(gè)對(duì)象的created_at字段從UTC時(shí)間格式轉(zhuǎn)換為本地時(shí)間格式。最終，顯示本地時(shí)間在界面上。

記得在實(shí)際應(yīng)用中，確保你的時(shí)間數(shù)據(jù)以正確的格式和類型存在，并且適當(dāng)?shù)靥幚砜赡艿腻e(cuò)誤情況

  convertUTCtoLocal(utcTime) {
      const utcDate = new Date(utcTime);
      const localDate = new Date(utcDate.getTime() + utcDate.getTimezoneOffset() * 60000);
      return localDate.toLocaleString();
    }

頁面渲染部分

  <ul>
      <li v-for="(item, index) in list" :key="index">
        <p>ID: {{ item.id }}</p>
        <p>本地時(shí)間: {{ convertUTCtoLocal(item.created_at) }}</p>
      </li>
    </ul>

最終效果

文章來源地址http://www.zghlxwxcb.cn/news/detail-693486.html

到了這里，關(guān)于前端將UTC時(shí)間格式轉(zhuǎn)化為本地時(shí)間格式～～uniapp寫法的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！