Estoy probando MAUI Blazor y potencialmente es genial, pero tuve algunos problemas (muchos). Quiero llamar a alguna función de javascript a la vista principal de blazorweb, pero no sé cómo hacerlo. Desde MainLoyout.razor tomo blazorwebview.
<b:BlazorWebView x:Name="mainView" HostPage="wwwroot/index.html"> <b:BlazorWebView.RootComponents> <b:RootComponent Selector="#app" ComponentType="{x:Type local:Main}" /> </b:BlazorWebView.RootComponents> </b:BlazorWebView>Pero desde aquí no sé cómo inyectar javascript. Gracias
Consulte la siguiente documentación: https://docs.microsoft.com/en-us/aspnet/core/blazor/javascript-interoperability/call-dotnet-from-javascript?view=aspnetcore-6.0
Página principal.xaml
<Button Text="Press me" Clicked="button_Clicked"/> <b:BlazorWebView HostPage="wwwroot/index.html"></b:BlazorWebView>MainPage.xaml.cs
private async void button_Clicked(object sender, EventArgs e) { var js = webView.Handler.MauiContext.Services.GetService<IJSRuntime>(); var result = await js.InvokeAsync<string>("executeMe", "DEF"); // Look at the Visual Studio Output window to see this message Debug.WriteLine(result); }MauiProgram.cs
public static class MauiProgram { public static MauiApp CreateMauiApp() { var builder = MauiApp.CreateBuilder(); builder .UseMauiApp<App>() .ConfigureFonts(fonts => { fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular"); }); builder.Services.AddMauiBlazorWebView(); builder.Services.AddBlazorWebViewDeveloperTools(); return builder.Build(); } [JSInvokable] public static async Task<string> CallMeFromJs(string a) { return a + " OK!"; } }índice.html
<input type="button" id="btn" value="Call .Net" /> <script type="text/javascript"> window.executeMe = (a) => { // Click on BlazorWebView and press F12 to open DevTools to see the console logs // You might need to add builder.Services.AddBlazorWebViewDeveloperTools(); in the CreateMauiApp() method console.log("Call: " + a); return a + " OK!"; }; </script> <script type="text/javascript"> document.getElementById('btn').onclick = function () { DotNet.invokeMethodAsync('MauiApp1', 'CallMeFromJs', 'ABC') .then(data => { // Click on BlazorWebView and press F12 to open DevTools to see the console logs // You might need to add builder.Services.AddBlazorWebViewDeveloperTools(); in the CreateMauiApp() method console.log(data); }); }; </script> <script src="_framework/blazor.webview.js" autostart="false"></script>Espero que ayude.