javascript - 在自定义日历中显示获取的日期React Native

标签 javascript reactjs react-native ecmascript-6 react-redux

所以基本上我为我的医生预约应用程序创建了一个自定义日历,如下所示:enter image description here

它显示当前星期和日期。 到目前为止,这些时间段是我制作并在平面列表中呈现的静态数组:

this.state = {
      timeList: [
        { id: 1, time: "08:00 am" },
        { id: 2, time: "09:00 am" },
        { id: 3, time: "10:00 am" },
        { id: 4, time: "11:00 am" },
        { id: 5, time: "12:00 pm" },
        { id: 6, time: "01:00 pm" },
        { id: 7, time: "02:00 pm" },
        { id: 8, time: "03:00 pm" },
        { id: 9, time: "04:00 pm" },
        { id: 10, time: "05:00 pm" },
        { id: 11, time: "06:00 pm" },
        { id: 12, time: "07:00 pm" },
        { id: 13, time: "08:00 pm" }
      ]
    };
and:
<FlatList
            data={this.state.timeList}
            renderItem={({ item, index }) => this.renderTimeData(item, index)}
            keyExtractor={(item, index) => index.toString()}
          />

所以我的问题是我想以考虑当天日期的方式渲染获取的数据的时间。例如,这里是数据日志:

enter image description here 因此,从该属性“date_start”我应该确保日期与我的日历匹配,以便我可以显示“9:30” 知道我该如何处理它吗? 我希望我的表述足够清楚,并感谢您的建议

最佳答案

您可以简单地使用像 Moment 这样的库识别您的对象的日期和时间,如下所示,

let date = moment("2020-03-23 09:30").format('YYYY-MM-DD');
console.log(date)

let time = moment("2020-03-23 09:30").format('h:mm A');
console.log(time)

欲了解更多信息,请查看String format时刻。

希望这对您有帮助。如有疑问,请放心。

关于javascript - 在自定义日历中显示获取的日期React Native,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60814727/

相关文章:

javascript - 为什么我的 Javascript 不能在 django 模板中工作

javascript - Node.JS 和同步数据库查询

javascript - 如何从 json 渲染对象

react-native - 在 action creator 中获取状态的 Redux 模式

javascript - 有没有办法挂接到 Webpack 的 AST 以使其识别新的模块格式?

javascript - 有多个 uploadify 实例时未传递 scriptData

javascript - react .js : Set Prop only when condition is true

python - 用于运行 Django 后端和 React 前端的 Makefile

javascript - react native this.refs.nav 未定义

javascript - 禁用父级按钮