0
316
VistasCómo eliminar varios parámetros de URL
Hay un problema con la eliminación de varios parámetros de cadena. Ahora solo se está eliminando el último parámetro.
upd : no especifiqué que quería lograr la capacidad de eliminar valores de parámetros específicos
este código no funciona correctamente:
const updateFiltersSearchParams = (paramKey, newValue) => { const isParamExist = searchParams.getAll(paramKey).includes(newValue); if (!isParamExist) { searchParams.append(paramKey, newValue); setSearchParams(searchParams); } else { const updatedSearchParams = new URLSearchParams( [...searchParams].filter( ([key, value]) => key !== paramKey || value !== newValue ) ); setSearchParams(updatedSearchParams); } }; const handleDeleteParams = () => { [...checkboxParams].forEach((param) => { updateFiltersSearchParams("selected", param); }); };
·
Juan Pablo Isaza
3 Respuestas
Responde la pregunta0
cambie su función handleDeleteParams con esto
const handleDeleteParams = () => { setSearchParams([]); };
·
Juan Pablo Isaza
Denunciar
0
Si desea eliminar * solo los parámetros queryString selected ( o cualquier clave queryString específica ), puede usar el método de delete del objeto URLSearchParams y luego poner en cola la actualización de la URL de los parámetros.
const handleDeleteParams = (key) => { searchParams.delete(key); setSearchParams(searchParams); };...
<button type="button" onClick={() => handleDeleteParams("selected")}> Clear all "selected" params </button> 
·
Juan Pablo Isaza
Denunciar
0
Resolvió el problema modificando la función de esta manera.
const toggleSearchParams = (params) => { const newSearchParams = [...searchParams]; for (const prevParam of params) { const index = newSearchParams.findIndex( (newParam) => prevParam[0] === newParam[0] && prevParam[1] === newParam[1] ); if (index === -1) { newSearchParams.push(prevParam); } else { newSearchParams.splice(index, 1); } } setSearchParams(new URLSearchParams(newSearchParams)); }; const handleChangeCheckBoxValue = (e) => { toggleSearchParams([["selected", e.target.value]]); }; const handleDeleteParams = () => { toggleSearchParams(checkboxParams.map((param) => ["selected", param])); };
·
Juan Pablo Isaza
Denunciar
Responde la pregunta