JSFiddle - React, Tailwind, and code Playground
HTML
<div id="tgt"></div>
JavaScript
// This function is just for displaying JSON after decode
function dump(obj) {
var out = '';
for (var i in obj) {
out += i + ": " + obj[i] + "\n";
}
var pre = document.createElement('pre');
pre.innerHTML = out;
document.body.appendChild(pre)
}
//Begining JSON encoding/decoding
//Test JSON data
testJSON = {"test1":"val1","test2":"val2"}
//Encode JSON to URI
encoded = encodeURIComponent(JSON.stringify(testJSON));
//Display encoded JSON
$("<div>Encoded Data:<div>").appendTo($("#tgt"));
$("<div>"+encodeURIComponent(JSON.stringify(testJSON))+"<div>").appendTo($("#tgt"));
//Decode URI to JSON
decoded = JSON.parse(decodeURIComponent(encoded));
//Display decoded JSON
$("<br><br><div>Decoded Data:<div>").appendTo($("#tgt"));
dump(decoded);