BlazorHelpers
Helpers to interact with javascript apis using blazor
Next Plan
Add Support for Bootstrap 5 with callbacks for events. see the Bootstrap Branch to track progress.
Documentation Here
instalation
How to use?
You can see the Test app to get inspiration
JQuery
in program.cs
public static async Task Main(string[] args)
{
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("app");
builder.Services
.AddJquery() // to use Jquery
.AddDOMHelper() // To use DOM
.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });
await builder.Build().RunAsync();
}in the _layour.cshtml or index.html add the following scripts:
<script src="_content/BlazorHelper/jquery-3.5.1.min.js"></script>
<script src="_content/BlazorHelper/JqueryInterop.js"></script>in the component you want to use
@inject Jquery Jquery
// Jquery methods are not available on Initialize Functions
protected override Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
new JObject("#H").SetCss("color", "red");
}
return base.OnAfterRenderAsync(firstRender);
}DOM
in the _layour.cshtml or index.html add the following scripts:
<script src="_content/BlazorHelper/DOMInterop.js"></script>in the component you want to use
@inject DOMHelper Dom
protected override async Task OnInitializedAsync()
{
await base.OnInitializedAsync();
await Dom.SetLocalStorage("hello", "secondHello");
}
