• Empleos
  • Sobre nosotros
  • profesionales
    • Inicio
    • Empleos
    • Cursos y retos
  • empresas
    • Inicio
    • Publicar vacante
    • Nuestro proceso
    • Precios
    • Evaluaciones
    • Nómina
    • Blog
    • Comercial
    • Calculadora de salario

0

119
Vistas
Clear storage with addEventListener

I am trying to clear localstorage with a button and an addEventListener. But its not working, and I cant figure out why. Thanks.

    const clearStorage = document.querySelector(".clear-button");

    clearStorage.addEventListener("click", (function(){
        localStorage.clear();
    }));
};

This code gets imported to the script below:

import { getFavourites } from "./utils/getFavs.js";
import createMenu from "./components/createMenu.js";
import displayMessage from "./components/displayMessage.js";
import { clearFavList } from "./components/clearFavList.js"

createMenu();
getFavourites();

const favouriteList = getFavourites();
const articlesContainer = document.querySelector(".favourites-container");
if(!favouriteList.length) {
    displayMessage("error", "You don't have any saved favourites yet.", ".favourites-container");
}
favouriteList.forEach((favourite) => {
    articlesContainer.innerHTML += `<div class="article">
                                    <div class="article-content-text">
                                        <h2 class="article-title fav-wrapper-text">Title: ${favourite.title}</h2>
                                    </div>
                                    <div>
                                        <i class="fas fa-heart favButton"></i>
                                    </div>
                                    </div>`;
});

clearFavList(favouriteList);
almost 3 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

This code, from a React auth component, have all the basic functions to handle storage.

// you can create multiple storage stores
const LOCAL_STORAGE_STORE = 'storage_sample';

export const getHasLocalStorageAuth = () => {
    // check local storage
    const localStorage = __getLocalStorage(LOCAL_STORAGE_STORE);
    return { status: !!localStorage, data: localStorage.auth };
};

export const clearLocalStorageAuth = () => {
    __clearLocalStorage(LOCAL_STORAGE_STORE);
    return;
};

export const setLocalStorageAuth = (newLocalStorage: any) => {
    __setLocalStorage(LOCAL_STORAGE_STORE, newLocalStorage);
    return;
};

// setting data to localstorage
export function __setLocalStorage(
    localStorageName: string,
    localStorageValue: any,
    isJson = true
) {
    if (isJson) {
        localStorage.setItem(localStorageName, JSON.stringify(localStorageValue));
    } else {
        localStorage.setItem(localStorageName, localStorageValue);
    }
}

// getting data from localstorage
export function __getLocalStorage(localStorageName: string): any {
    let localStorageValue: any;
    if (localStorage.getItem(localStorageName) !== null) {
        localStorageValue = localStorage.getItem(localStorageName);
    } else {
        localStorageValue = false;
    }

    return JSON.parse(localStorageValue);
}

// clear data from localstorage
export function __clearLocalStorage(localStorageName: string | null) {
    localStorage.clear();
}

almost 3 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Nuestro proceso Comercial
Legal
Términos y condiciones Política de privacidad
© 2025 PeakU Inc. All Rights Reserved.

Andres GPT

Recomiéndame algunas ofertas
Necesito ayuda