olá sou aprendiz em programação. tenho uma duvida sobre localStorage, quando mando dados para ‘lS’ os dados são substituidos. eu quero que fique salvo e quando digitar outros dados seja criado novamente, ao invés de …

Criando Listas no localStorage

1 Resposta

Solucao aceita

Lucas_Camara 2 de fev. de 2022 1 like

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
</head>

<body>
  <button onclick="createClient()">Adicionar cliente</button>
  <button onclick="clearClients()">Limpar clientes</button>

  <br />

  <pre><code id="clientes"></code></pre>

  <script>
    const CLIENTES_STORAGE_NAME = 'clientes'

    const cliente = {
      nome: "duda",
      email: "[email removido]",
      celular: "098765431230",
      cidade: "recantao"
    }

    const createClient = () => {
      const clientesString = localStorage.getItem(CLIENTES_STORAGE_NAME)
      const clientes = clientesString ? JSON.parse(clientesString) : null;
      
      if (clientes == null) {
        clearClientes();
        clientes = []
      }
      
      clientes.push(cliente);
      localStorage.setItem(CLIENTES_STORAGE_NAME ,JSON.stringify(clientes));
      showClients();
    }

    const showClients = () => {
      const clientes = JSON.parse(localStorage.getItem(CLIENTES_STORAGE_NAME));
      document.getElementById('clientes').innerText = JSON.stringify(clientes, null, 4);
      console.log(clientes);
    }

    const clearClients = () => {
      localStorage.setItem(CLIENTES_STORAGE_NAME, '[]');
      showClients();
    }
  </script>
</body>

</html>

Atualizei o exemplo para apresentar o json na página

1 Resposta

Topicos relacionados