时间戳

首页 > 解决方案 > React Native 时区和格式选项

javascript - React Native 时区和格式选项

问题描述

我是 React Native 的新手，我在尝试做一些我在 PHP 和其他语言中做过很多次的事情时遇到了最困难的事情。

有很多方法可以处理时区转换和日期格式，但是我运气不好，我在这方面花了太多时间。

这是我正在尝试做的事情：

  1. 取来自 MariaDB/MySQL 格式的日期，如 2021-09-11 00:22:00 等，并以 UTC 时间存储。我把它放在一个变量中，并准备好在我的 React 应用程序中进行转换。
  2. 根据用户的设备时区或我可以为该用户指定的指定时区将 MySql 日期如上所示转换为本地时区（我已经将其存储在我的数据库中）。
  3. 取步骤 2 中的日期并以各种方式格式化，如 12 小时格式、24 小时格式、星期几版本的星期几等。

例如，我可以在 PHP 中很容易地完成这些事情，我以为我以前在 vanilla JS 中做过类似的事情，但不记得了。在过去的两天里，我一直在这个兔子洞里，我因为约会而摔倒了。Uggg 帮我出去。

我目前正在使用下面的代码，它在 IOS 上做了我想要的，我以为我已经完成了，直到我在 Android 上测试并意识到它在 Android 上显示了军事时间。优格..

我已经看到了使用 moment.js 的建议，但是当我仔细查看时，它基本上说它是老派，不应该用于现代编码。

我正在寻找现代而不是非常复杂的东西，我不认为我正在做的事情非常复杂 Geesh .. 不喜欢使用图书馆，但如果我必须这样做，我不必再花 2 天时间搞砸日期转换。

这是我现在为我的应用程序制作的组件中的内容。我敢肯定这在代码方面很糟糕，但它可以在 Android 上运行。

提前感谢您的帮助。

当我将 MySQL 日期推入其中时，这就是我所拥有的输出内容，例如 Fri 09/09/2021, 10:29 pm。在 Android 中显示相同的输出但军用（24 小时）时间。

import React from 'react';

const DateConvert = (rawDate) => {
    // Convert the date into local time based on handset
    const msgDateLocal = new Date(rawDate);

    let msgDateDay; // Convert the numeric weekday to something more readable ZERO based
    switch (msgDateLocal.getDay()) {
        case 0:
            msgDateDay = "Sun";
            break;
        case 1:
            msgDateDay = "Mon";
            break;
        case 2:
            msgDateDay = "Tue";
            break;
        case 3:
            msgDateDay = "Wed";
            break;
        case 4:
            msgDateDay = "Thu";
            break;
        case 5:
            msgDateDay = "Fri";
            break;
        case 6:
            msgDateDay = "Sat";
            break
        default:
            msgDateDay = "Invalid day of the week";
    }

    // Let's do a little formatting to make it all pretty
    return `${msgDateDay} ${msgDateLocal.toLocaleDateString()} ${msgDateLocal.toLocaleTimeString()}`;

};

export default DateConvert;

标签： javascriptreactjsreact-nativedatemariadb

解决方案

我能够使用此处显示的示例解决此问题reactnativecode.com/get-current-time-in-12-hours-am-pm-format不确定是否有更好的方法但是，这使我能够解决我的问题和继续做一些比搞砸日期更有趣的事情......感谢您的回复和帮助。

推荐阅读