标签: blazor-server-side

我有一个自定义组件，当它在浏览器中呈现时，我需要测量其大小（在 JavaScript 中）并回调 Blazor。

如何注册 JavaScript 以在特定组件渲染完成后调用？

我有以下类似于TextBox组件的组件。然而由于某种原因，内容似乎Value永远不会改变。

我本希望它可以在没有手动 JavaScript 的情况下与数据绑定一起使用，不是吗？

<div class="form-group">
    <input type="text" class="form-control" @bind="Value" @onkeyup="OnKeyUp" placeholder="@Placeholder"/>
</div>

@code {
    
    [Parameter]
    public string Value { get; set; }

    [Parameter]
    public EventCallback<string> ValueChanged { get; set; }

    [Parameter]
    public string Placeholder { get; set; }

    private void OnKeyUp(KeyboardEventArgs obj)
    {
        ValueChanged.InvokeAsync(Value);
    }

}

UserManager.GetUserAsync(authState.User)UserManager除非已经被调用，否则会抛出异常。

例如;

这引发NullReferenceException了await UserManager.GetUserAsync(authState.User);

@ page "/"
@inject UserManager<ApplicationUser> UserManager

<AuthorizeView>
  ...
</AuthorizeView>

@code{
    [CascadingParameter]
    private Task<AuthenticationState> authenticationStateTask { get; set; }

    protected async override Task OnInitializedAsync()
    {
      var authState = await authenticationStateTask;
      var currentUser = await UserManager.GetUserAsync(authState.User); // exception here
    }
}

但这工作正常；

@ page "/"
@inject UserManager<ApplicationUser> UserManager

<AuthorizeView>
  ...
</AuthorizeView>

@code{
    [CascadingParameter]
    private Task<AuthenticationState> authenticationStateTask { get; set; }

    protected async override Task OnInitializedAsync()
    {
      var allUsers = UserManager.Users.ToList(); // hack …

简单的问题：如何在 Blazor 中转义“@”字符，以便在此示例中不会出现引用错误？

<script src="https://unpkg.com/@here/harp.gl/dist/harp.js"></script>

我已经尝试过“\@”和“\\@”

如何在 Blazor SPA 上嵌入 Leaflet 地图、使用 JSInterop、应定义哪些对象以及如何将表示在地图上单击的位置的数据从 JavaScript 传递到 Blazor

我正在开发一个 Web 应用程序 - 托管在 ASP.NET 上的 Blazor WebAssembly。我正在尝试开始从数据库获取价值（使用实体框架）。我在我的解决方案中使用存储库和工作单元模式。所以，我遇到了这个错误：

An unhandled exception has occurred while executing the request.
      System.InvalidOperationException: Unable to resolve service for type 'ReportApp.Core.Services.TaskService' while attempting to activate 'ReportApp.Server.Controllers.TaskController'.
         at Microsoft.Extensions.DependencyInjection.ActivatorUtilities.GetService(IServiceProvider sp, Type type, Type requiredBy, Boolean isDefaultParameterRequired)
         at lambda_method8(Closure , IServiceProvider , Object[] )
         at Microsoft.AspNetCore.Mvc.Controllers.ControllerActivatorProvider.<>c__DisplayClass4_0.<CreateActivator>b__0(ControllerContext controllerContext)
         at Microsoft.AspNetCore.Mvc.Controllers.ControllerFactoryProvider.<>c__DisplayClass5_0.<CreateControllerFactory>g__CreateController|0(ControllerContext controllerContext)
         at Microsoft.AspNetCore.Mvc.Infrastructure.ControllerActionInvoker.Next(State& next, Scope& scope, Object& state, Boolean& isCompleted)
         at Microsoft.AspNetCore.Mvc.Infrastructure.ControllerActionInvoker.InvokeInnerFilterAsync()
      --- End of stack trace from previous location ---
         at Microsoft.AspNetCore.Mvc.Infrastructure.ResourceInvoker.<InvokeNextResourceFilter>g__Awaited|24_0(ResourceInvoker invoker, Task lastTask, State next, …

我正在尝试从 Blazor 服务器页面关闭浏览器窗口。在 asp.net 中我会执行以下操作：

       Response.Write("<script>window.close();</script>")

我如何在 Blazor 服务器页面上执行此操作？

谢谢

例如，如果我有一个底层数据类型为 int 的 InputNumber，我想显示一条消息，指出不允许大于 int.MaxValue 的数字。目前，如果我要尝试任何大于整数最大值的数字，我会收到一条默认消息：“该字段必须是数字”。该消息显然不正确，我想更改它。有没有办法在 Blazor 中做到这一点？

在 Blazor 服务器应用程序中，我尝试生成 HTML，该 HTML 将在电子邮件中呈现以供使用。

这意味着，服务器将基于模板生成完整的 HTML，我将其与各种数据位合并。

我想做的一件事是包含一些条件 HTML，以便它在 Outlook 中呈现良好，我想做的一些事情如下所述：https ://ourcodeworld.com/articles/read/139/all -您需要了解条件 html 评论

当我包含任何 html 注释时，Blazor 的渲染引擎会忽略它们并且不会将它们包含在输出中。

有什么方法可以强制 Blazor 的渲染器包含我的评论吗？

我有一个在服务器端呈现的 Blazor 组件。我想在里面有一些可折叠的div。然而，由于代码是服务器渲染的，因此不会执行 Javascript，因此这些部分不会崩溃。

这是我的文件中的代码script.js：

var coll = document.getElementsByClassName("collapsible");
var i;

for (i = 0; i < coll.length; i++) {
    coll[i].addEventListener("click", function() {
        this.classList.toggle("active");
        var content = this.nextElementSibling;
        if (content.style.maxHeight){
            content.style.maxHeight = null;
        } else if(window.matchMedia("(max-width:1440px)")){
            // content.style.maxHeight = content.scrollHeight + "px";
            content.style.maxHeight = "20vh";
        } 
        else {
            content.style.maxHeight = "50vh";
        }
    });
}

这是我的main.cshtml文件：

<component type="typeof(Main)" render-mode="Server" />

<script src="~/js/script.js" type="text/javascript"></script>

最后是我的Main带有可折叠部件的组件：

@using Microsoft.AspNetCore.Components;
@using Microsoft.AspNetCore.Components.Web;

<div class="collapsible">
    <label for="tutu">HEADER</label>
    <div id="mybtn" class="btn-rch"></div> …