React Native-如何延迟启动



大家好,我正在尝试制作一个带有大量自定义功能的倒计时计时器,但我的第一个问题是如何延迟它的启动。

它从0秒开始,需要一点时间才能获得我从上一页传递的值

const CountDownScreen = ({route, navigation}) => {
const meditationTime = route.params.time;

我花时间

const getMedTime = () => {
let res = meditationTime;
return new Promise(resolve => resolve(res));
};

州的时间我会得到

const [timeToGive, setTimeToGive] = useState();

useEffect(() => {
const setTimeState = async () => {
const getTime = await getMedTime();
console.log('get time', getTime);
// setGotTime(getTime);
let timeToGive = {
minutes: 0,
seconds: getTime,
};
setTimeToGive(timeToGive);
};
setTimeState();
updateTimer();
}, []);

状态与时间

const [time, setTime] = useState(
{
eventDate: moment.duration().add(timeToGive),
},
);

计时器启动(我想是在承诺之后(

const updateTimer = () => {
const x = setInterval(() => {
let { eventDate } = time;
if (eventDate <= 0) {
clearInterval(x);
sessionEnded();
} else {
eventDate = eventDate.subtract(1, 's');
const mins = eventDate.minutes();
const secs = eventDate.seconds();
setTime({
mins,
secs,
eventDate,
});
}
}, 1000);
setIntervalTime(x);
};

我尝试了很多不同的解决方案,但都不起作用。总是起步晚我想避免setTimeout有更好的功能吗?谢谢

这是因为您使用的是setInterval,它只在1秒后开始(在您的情况下(。

你可能应该重新调整你的代码并做一些类似的事情:

x(); // Call x once
setInterval(() => {
x(); 
}, 1000); // Call x after every seconds

你可以将intervalId存储到一个状态中,这样你就可以清除它。

相关内容

  • 没有找到相关文章