Offcanvas Backdrop Disappears On Wire:Click about bootstrap

[danielsonoiki]

I fixed this by creating a custom CSS class .canvas-backdrop and tied it to both data-bs-toggle="offcanvas" and data-bs-dismiss="offcanvas".

CSS Code:

.canvas-backdrop {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgb(0, 0, 0);
	overflow: hidden;
	width: 100vw;
	height: 100vh;
	z-index: 1040;
}
.canvas-backdrop.show {
	display: block;
	opacity: .5;
}

jQuery code:

$('[data-bs-toggle="offcanvas"]').on('click', function() {
		$('.canvas-backdrop').toggleClass('show');
	});

	$('[data-bs-dismiss="offcanvas"]').on('click', function() {
		$('.canvas-backdrop').removeClass('show');
	});

And this solved the issue permanently.