how to convert javascript to jsx
$ npm install html-react-parser react react-domhow to convert javascript to jsx
$ npm install html-react-parser react react-domhtml to jsx
1) Option One: Online
https://magic.reactjs.net/htmltojsx.htm
or
https://transform.tools/html-to-jsx
2) Option Two: System (assuming you have npm)
npm install html-to-jsxconvert to jsx
$(window).on('load', function () {
$(".portfolio-filter").each(function () {
var e = $(this);
e.imagesLoaded(function () {
var $grid = e.isotope({
layoutMode: "masonry",
});
$(".portfolio-menu").find("a").on("click", function () {
var filterValue = $(this).attr("data-filter");
return $(".portfolio-menu").find("a").removeClass("active"), $(this).addClass("active"),
$grid.isotope({
filter: filterValue
}), !1
});
});
});
});convert to jsx
<script>
$(".forgot-password").click(function () {
$("#forgot-password-wrapper").show();
$("#forgot-password-wrapper").addClass("animated flipInY");
$("#login-form-wrapper").hide();
$("#signup-form-wrapper").hide();
});
$(".back-to-signin").click(function () {
$("#login-form-wrapper").show();
$("#login-form-wrapper").addClass("animated flipInY");
$("#forgot-password-wrapper").hide();
$("#signup-form-wrapper").hide();
});
$(".back-to-signup").click(function () {
$("#signup-form-wrapper").show();
$("#signup-form-wrapper").addClass("animated flipInY");
$("#forgot-password-wrapper").hide();
$("#login-form-wrapper").hide();
});
</script>convert to jsx
<script>
const menuBtn = document.querySelector(".menu-icon span");
const searchBtn = document.querySelector(".search-icon");
const cancelBtn = document.querySelector(".cancel-icon");
const items = document.querySelector(".nav-items");
const form = document.querySelector("form");
menuBtn.onclick = ()=>{
items.classList.add("active");
menuBtn.classList.add("hide");
searchBtn.classList.add("hide");
cancelBtn.classList.add("show");
}
cancelBtn.onclick = ()=>{
items.classList.remove("active");
menuBtn.classList.remove("hide");
cancelBtn.classList.remove("show");
form.classList.remove("active");
cancelBtn.style.color = "#fff";
}
searchBtn.onclick = ()=>{
form.classList.add("active");
searchBtn.classList.add("hide");
cancelBtn.classList.add("show");
}
</script>convert to jsx
$(function() {
var $win = $(window);
var $box = $(".search-box");
$win.on("click.Bst", function(event) {
if (
$box.has(event.target).length == 0 //checks if descendants of $box was clicked
&&
!$box.is(event.target) //checks if the $box itself was clicked
) {
$('#search-stoke').val("");
}
});
});Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
