Pasar variables en la url Gatsby

December 31st, 2021 | 2 min read | get variable

En esta entrada vamos a ver como pasar variables en la url, tipica web que pasa unas variables en la url via Get, que la siguiente página va a recoger esas variables y hacer algo con ellas.

El problema que ocurre con Gatsby es que cuando pasas variables por la url y preguntas desde js por windows.location.search (para recuperar las variables) y compilas Gatsby te va a dar errores ya que el paso a producción no existen la variable windows.

Si quieres más información de esto último lo tienes en este enlace.

Ahora bien, volviendo al tema que nos ocupa, como paso variables y las recojo. El código sería algo así:

Por un lado formamos la url con los datos que queremos enviar, sería algo así.

dominio.com?iva=21&prezzoPerIva=55230.45&prezzo=45645&sumadedu=suma

Y en la url que queremos recoger los valores montariamos algo así:

  let params = '';
  let iva = '';
  let prezzoPerIva = '';
  let prezzo = '';
  let sumadedu = '';
  let url = '';
  let sumaDevenga='';
  let conSin='';

  if (typeof window !== 'undefined') {
     params = new URLSearchParams(window.location.search);
     iva = params.get("iva");
     prezzoPerIva = params.get("prezzoPerIva");
     prezzo = params.get("prezzo");
     sumadedu = params.get("sumadedu");
     url = window.location.href;

  }

Cómo puedes ver, lo primero que hago es poner todos los valores a cero, pregunto si window existe o no por evitar los errores de paso a producción y por último recojo los valores y luego ya realizo las operaciones que necesite con esos valores.

Este sería un ejemplo funcionando:

https://comocalculariva.com/

Escribe los valores que quieras y mira como los recoje la pantalla final.

Volver

Miguel, consultor y desarrollador web, devOps and warrior code XD