Javascript 在React Native中检测日期更改并在用户设置的时间发送通知

Javascript 在React Native中检测日期更改并在用户设置的时间发送通知,javascript,android,reactjs,react-native,Javascript,Android,Reactjs,React Native,我正在编写一个提醒应用程序,我面临着在不卸载和重新安装组件的情况下实际检测日期和时间变化的挑战 我希望能够在日期和时间与用户指定的相同时发送推送通知 我已经在谷歌和YouTube上搜索了几次,但似乎没有人真的在这方面有任何文章或视频。第一个解决方案是将数据存储在服务器中,并通过服务器发送通知。 第二个解决方案是,当应用程序处于后台模式时,可以在React native中使用Headless js来运行后台进程。您可以在下面的链接中阅读有关headless的内容 您可以使用luxon库来获取提醒时

我正在编写一个提醒应用程序,我面临着在不卸载和重新安装组件的情况下实际检测日期和时间变化的挑战

我希望能够在日期和时间与用户指定的相同时发送推送通知


我已经在谷歌和YouTube上搜索了几次,但似乎没有人真的在这方面有任何文章或视频。

第一个解决方案是将数据存储在服务器中,并通过服务器发送通知。 第二个解决方案是,当应用程序处于后台模式时,可以在React native中使用Headless js来运行后台进程。您可以在下面的链接中阅读有关headless的内容

您可以使用
luxon
库来获取提醒时间和现在之间的差异。然后使用diff中的mills值调用
setInterval
,从而使计时器计数器与系统时钟同步。请参见下面的我的代码:

import React, { useEffect, useState } from 'react';
import { View } from 'react-native';
import { DateTime } from 'luxon';

const getDateTimeDiffFromNow = (
  finishSeconds: number,
): {
  minutes: number,
  milliseconds: number,
  expired?: boolean,
} => {
  const now = DateTime.local();

  if (now.toSeconds() >= finishSeconds) {
    return { minutes: 0, milliseconds: 0, expired: true };
  }

  const finish = DateTime.fromSeconds(finishSeconds);

  return finish
    .diff(now, ['minutes', 'milliseconds'])
    .toObject();
};

const DateTimer = ({ finishSeconds }: Props) => {
  const [diff, setDiff] = useState(() =>
    getDateTimeDiffFromNow(finishSeconds),
  );

  useEffect(() => {
    if (diff.expired) {
      return;
    }

    const timeoutId = setTimeout(
      () => setDiff(getDateTimeDiffFromNow(finishSeconds)),
      diff.milliseconds,
    );

    return () => clearTimeout(timeoutId);
  }, [diff, finishSeconds]);

  return (<View />)
};
import React,{useffect,useState}来自“React”;
从“react native”导入{View};
从'luxon'导入{DateTime};
常量getDateTimeDiffFromNow=(
finishSeconds:数字,
): {
分钟数:,
毫秒:数字,
过期?:布尔值,
} => {
const now=DateTime.local();
如果(now.toSeconds()>=finishSeconds){
返回{分钟:0,毫秒:0,过期:true};
}
const finish=DateTime.fromSeconds(finishSeconds);
返回终点
.diff(现在,['minutes'、'millizes'])
.toObject();
};
const DateTimer=({finishSeconds}:Props)=>{
常量[diff,setDiff]=useState(()=>
getDateTimeDiffFromNow(finishSeconds),
);
useffect(()=>{
如果(差异过期){
回来
}
const timeoutId=setTimeout(
()=>setDiff(getDateTimeDiffFromNow(finishSeconds)),
差分毫秒,
);
return()=>clearTimeout(timeoutId);
},[diff,finishSeconds]);
返回()
};

我不知道为什么这被否决了。。。但听起来您想要的似乎是一个计划的本地通知(不需要服务器,也不需要在JS端检测日期/时间的变化),您可以使用react本地推送通知来完成—请参阅