为什么我的复位函数在调用 clearHistory() 时不复位计时器?

Why doesn't my reset function reset the timer when I call clearHistory()?

提问人:Junwen Huang 提问时间:10/18/2023 更新时间:10/18/2023 访问量:15

问:

我正在制作一个谷歌扩展程序,它将跟踪我在不同站点上花费的时间并将其存储到本地存储中。我正在尝试添加一个清除功能,它将清除所有本地存储并将计时器重置回当前站点上的 00:00:00。现在我有清除所有本地存储的函数,但它不会将计时器重置回 00:00:00。这是我的代码库。 弹出.js

import storageModule from "./src/JS/storage.js";
import clockModule from "./src/JS/clock.js";
const resetButtonElement = document.querySelector('.clear');
const clockElement = document.querySelector('.clock');
const hostnameElement = document.querySelector('.hostname');

document.addEventListener("DOMContentLoaded", function () {
    // Open a connection to the background script
    const port = chrome.runtime.connect({ name: 'popupConnection' });

    // Listen for messages from the background script
    port.onMessage.addListener(function (message) {
        if (message.hostname) {
            hostnameElement.textContent = message.hostname;
        }

        if (message.clock) {
            
            clockElement.textContent = message.clock;
        }

    });

    const urlParams = new URLSearchParams(window.location.search);
    const time = urlParams.get('time');
    clockElement.textContent = time;

    // Add an event listener to detect when the popup is closed
    window.addEventListener("beforeunload", function () {
        port.disconnect();
    });
});

resetButtonElement.addEventListener('click', function() {
    storageModule.clearHistory(function() {
        clockModule.resetTimeClock();
        clockElement.textContent="00:00:00"
    });
});

时钟.js

import { setPopClock } from "./popupUI.js";
let seconds = 0;
let minutes = 0;
let hours = 0;
// Clock function
function updateClock() {
    seconds++;

    if (seconds >= 60) {
        seconds = 0;
        minutes++;

        if (minutes >= 60) {
            minutes = 0;
            hours++;
        }
    }

    const hoursStr = hours.toString().padStart(2, '0');
    const minutesStr = minutes.toString().padStart(2, '0');
    const secondsStr = seconds.toString().padStart(2, '0');

    const clock = `${hoursStr}:${minutesStr}:${secondsStr}`;
    
    setTimeClock(clock);
    setPopClock(clock);
}

// Function to set the current time clock
function setTimeClock(timeClock) {
    const [h, m, s] = timeClock.split(':').map(Number);
    hours = h;
    minutes = m;
    seconds = s;
}

// Function to get the current time clock
function getTimeClock() {
    return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
}

// Function to reset the time clock
function resetTimeClock() {
    hours = 0;
    minutes = 0;
    seconds = 0;
}

const clockModule = {
    updateClock,
    setTimeClock,
    getTimeClock,
    resetTimeClock,
};

export default clockModule;

存储.js

import clockModule from "./clock.js";

// Function to update and store hostname-clock pairs in chrome.storage.local
function updateAndStoreHostnameClockPair(hostname, clock) {
    const data = {};
    data[hostname] = clock;

    chrome.storage.local.set(data, function () {
        if (chrome.runtime.lastError) {
            console.error(chrome.runtime.lastError);
        } else {
            console.log(`Data stored for ${hostname}`);
        }
    });
}

// Function to retrieve hostname-clock pairs from chrome.storage.local
function retrieveHostnameClockPairs(callback) {
    chrome.storage.local.get(null, function (result) {
        if (chrome.runtime.lastError) {
            console.error(chrome.runtime.lastError);
        } else {
            console.log("Retrieved data from storage:", result);
            callback(result);
        }
    });

    
}

function clearHistory(callback) {
     // Reset the clock immediately

    // Clear the local storage after the clock has been reset
    chrome.storage.local.clear(function() {
        if (chrome.runtime.lastError) {
            console.error(chrome.runtime.lastError);
        } else {
            console.log("Storage cleared successfully");
            callback();
        }
        // Call the callback function to update the clock in the popup
        
    });
    
}


const storageModule = {
    updateAndStoreHostnameClockPair,
    retrieveHostnameClockPairs,
    clearHistory,
};

export default storageModule;

我尝试在clearHistory函数之后和之前调用重置计时器函数,但由于某种原因,计时器仍将从前一个时钟运行,而不是从00:00:00开始。如您所见,除了我当前所在的站点之外,它清除了我访问过的所有站点的本地存储,是否可以清除当前站点计时器并将其重置为 00:00:00?请帮忙

JavaScript 回调

评论


答: 暂无答案