标签: blazorise

我正在使用 Blazorise DataGrid，我想制作一个自定义 DataGridColumn，其中 DisplayTemplate 预先设置为模板，但是如果我从 DataGridColumn 派生，我无法弄清楚我应该如何设置 DisplayTemplate。我从这个开始

   @typeparam TItem
   @inherits DataGridColumn<TItem>

但是后来我不知道如何将 DisplayTemplate 渲染片段设置为剃刀片段。

我也尝试过只制作一个包含 DataGridColumn 的组件，并在我的 DataGrid 中引用它，但是无论我将它放在 DataGrid 中的什么位置，该列总是在末尾。

我可能是错误的树，但我有很多实现接口的类，我总是希望为实现该接口的任何类型的任何数据网格中的特定列设置相同的 DisplayTemplate。因此，为此目的创建 DataGridColumn 派生类型似乎是合理的。

我收到此错误： enter code hereSystem.TypeLoadException：无法从 typeref 解析带有标记 0100001a 的类型（程序集“System.Runtime，Version=4.2.2.0，Culture=neutral，PublicKeyToken 中的预期类“System.Threading.Tasks.Task”） =b03f5f7f11d50a3a')

当我切换到：

<TargetFramework>netcoreapp3.1</TargetFramework> 

或者

<TargetFramework>netcoreapp5.0</TargetFramework>

来自netstandard2.1

我的包裹是：

<PackageReference Include="Blazored.LocalStorage" Version="2.1.5" />
        <PackageReference Include="Blazorise" Version="0.9.0.2" />
        <PackageReference Include="Blazorise.Bulma" Version="0.9.0.2" />
        <PackageReference Include="Blazorise.Components" Version="0.9.0.2" />
        <PackageReference Include="Blazorise.DataGrid" Version="0.9.0.2" />
        <PackageReference Include="Blazorise.Icons.FontAwesome" Version="0.9.0.2" />
        <PackageReference Include="Blazorise.Sidebar" Version="0.9.0.2" />
        <PackageReference Include="Blazorise.Snackbar" Version="0.9.0.2" />
        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="3.2.0" />
        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Build" Version="3.2.0" PrivateAssets="all" />
        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="3.2.0" PrivateAssets="all" />
        <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Authentication" Version="3.2.0" />
        <PackageReference Include="Microsoft.Extensions.Http" Version="5.0.0-preview.4.20251.6" />
        <PackageReference Include="System.Net.Http.Json" Version="5.0.0-preview.4.20251.6" />

        <PackageReference Include="Toolbelt.Blazor.I18nText" Version="9.0.1.1" />
        <PackageReference …

我有这个问题，我整晚都在试图解决这个问题，我正在为此绞尽脑汁，抱歉，如果这很愚蠢，我是一个相对较新的程序员..

它应该通过 Web API 从我的数据库获取一些数据，并将其显示在数据网格中（使用 blazorise 的数据网格），但它不起作用。

代码：

@using Newtonsoft.Json; \n@page "/email/inbox"\n<Row>\n    <Column>\n        <Card Margin="Margin.Is4.OnY">\n            <CardHeader>\n                <CardTitle>Data Grid</CardTitle>\n            </CardHeader>\n            <CardBody>\n                <CardText>Combine diferent datagrid options</CardText>\n            </CardBody>\n            <CardBody>\n                <DataGrid TItem="Fornecedor"\n                          Data="@dataModels"\n                          EditMode="DataGridEditMode.Popup"\n                          Editable="true"\n                          Sortable="true"\n                          Filterable="true"\n                          ShowPager="true"\n                          RowInserted="@OnRowInserted"\n                          RowUpdated="@OnRowUpdated"\n                          RowRemoved="@OnRowRemoved"\n                          UseInternalEditing="true"\n                          @bind-SelectedRow="@fornecedorSelecionado"\n                          Striped="true"\n                          Bordered="true"\n                          Hoverable="true"\n                          CustomFilter="@OnCustomFilter">\n                    <DataGridAggregates>\n                        <DataGridAggregate TItem="Fornecedor" Field="@nameof( Fornecedor.Email )" Aggregate="DataGridAggregateType.Count">\n                            <DisplayTemplate>\n                                @($"Total emails: {context.Value}")\n                            </DisplayTemplate>\n                        </DataGridAggregate>\n                        <DataGridAggregate TItem="Fornecedor" Field="@nameof( Fornecedor.Validado )" Aggregate="DataGridAggregateType.TrueCount" />\n                    </DataGridAggregates>\n                    <DataGridColumns>\n                        <DataGridCommandColumn TItem="Fornecedor" Width="170px">\n                            <NewCommandTemplate>\n                                <Button Color="Color.Success" Clicked="@context.Clicked">New</Button>\n                            </NewCommandTemplate>\n                            <EditCommandTemplate>\n                                <Button Color="Color.Primary" Clicked="@context.Clicked">Edit</Button>\n …

我使用Blazorise DataGrid组件来显示我的主/详细数据，您在其中单击主行，DataGrid 显示详细行/行。

如何使用RowDoubleClickedDataGrid 的功能并更改其自然行为，以在事件触发时显示详细信息行？

使用Blazorise bootstrap网格组件时，如何使用ColumnSize属性设置响应式布局选项。我希望小屏幕上的列大小为 12。

        <Row>
            <Column ColumnSize="ColumnSize.Is3">
                <StatusSelectListComponent @bind-Text="@_item.Status" OnSave="@ItemEditSave" OnCancel="@ItemEditCancel"></StatusSelectListComponent>
            </Column>
        </Row>

我正在尝试在表单中使用 blazorise RichTextEdit 组件。我似乎无法将最初设置为提供的模型属性的值。

<Form Model="@company">
    <Validations @ref="validations" Mode="ValidationMode.Auto" ValidateOnLoad="false" Model="@model">
        <Validation>
            <Field>
                <FieldLabel>Company Website</FieldLabel>
                <TextEdit Role="TextRole.Url" @bind-Text="@model.Property1" Placeholder="Enter your website" Size="Size.Large">
                    <Feedback>
                        <ValidationError />
                    </Feedback>
                </TextEdit>
            </Field>
        </Validation>
        <Field>
            <FieldLabel>About</FieldLabel>
            <RichTextEdit @ref="richTextEditRef"
                          ContentChanged="@OnContentChanged"
                          Theme="RichTextEditTheme.Snow"
                          PlaceHolder="Tell us about the company..."
                          SubmitOnEnter="false"
                          ToolbarPosition="Placement.Top">
                <Editor></Editor>
                <Toolbar>
                    <RichTextEditToolbarGroup>
                        <RichTextEditToolbarButton Action="RichTextEditAction.Bold" />
                        <RichTextEditToolbarButton Action="RichTextEditAction.Italic" />
                        <RichTextEditToolbarSelect Action="RichTextEditAction.Size">
                            <RichTextEditToolbarSelectItem Value="small" />
                            <RichTextEditToolbarSelectItem Selected="true" />
                            <RichTextEditToolbarSelectItem Value="large" />
                            <RichTextEditToolbarSelectItem Value="huge">Very Big</RichTextEditToolbarSelectItem>
                        </RichTextEditToolbarSelect>
                        <RichTextEditToolbarButton Action="RichTextEditAction.List" Value="ordered" />
                        <RichTextEditToolbarButton Action="RichTextEditAction.List" Value="bullet" />
                    </RichTextEditToolbarGroup>
                    <!-- Custom toolbar content --> …

我收到此错误，为 Blazor 和 Blazorise 中的项目使用规范测试和 bunit 进行单元测试：

无法使用单例“Bunit.Rendering.WebTestRenderer”中的范围服务“Microsoft.AspNetCore.Components.IComponentActivator”

这是单元测试的代码：

using BlazorApp1.Pages;
using Blazorise;
using Blazorise.Bootstrap;
using Blazorise.Icons.FontAwesome;
using Blazorise.Modules;
using Bunit;
using Microsoft.AspNetCore.Components.RenderTree;
using Microsoft.Extensions.DependencyInjection;
using Moq;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using TechTalk.SpecFlow;

namespace TestProject1
{
    [Binding]
    public sealed class Feature1StepDefinitions
    {

        private IRenderedComponent<Home> _cut;
        private readonly TestContext _ctx;

        
        private readonly Mock<IClassProvider> _classProviderMock;

        public Feature1StepDefinitions()
        {
            
            _ctx = new TestContext();


            _ctx.Services.AddBlazorise(options =>
            {
            })
            .AddBootstrapProviders()
            .AddFontAwesomeIcons();
            _ctx.Services.AddSingleton<IJSUtilitiesModule, JSUtilitiesModule>();
        }

            [Given("a list of stores")]
        public …

我正在尝试与 blazor 合作进行一个学习项目。安装 blazorise 后，导航栏无法像以前一样工作。一旦我启动了 web 应用程序，导航栏就没有显示，当我最小化 chrome 时，导航栏-toggler-icon 就会出现，点击该图标后，我可以看到我的导航栏。

在 NavMenu.razor 页面上，我只添加了一些导航链接（见下面的代码）。所以css类是原始的。我在 chrome 上没有任何错误。侧边栏启动后生成的html是：

<div class="sidebar"><!--!-->
    <!--!--><div class="top-row pl-4 navbar navbar-dark"><!--!-->
    <!--!--><a class="navbar-brand" href="">Rappenspalter</a>
    <button class="navbar-toggler"><!--!-->
        <span class="navbar-toggler-icon"></span>
    </button><!--!-->
</div><!--!-->

<div class="collapse"><!--!-->
    <ul class="nav flex-column"><!--!-->
        <li class="nav-item px-3"><!--!-->
            <!--!--><a href="" class="nav-link active"><!--!-->
                <span class="oi oi-home" aria-hidden="true"></span> Home
            </a><!--!-->
        </li><!--!-->
        <li class="nav-item px-3"><!--!-->
            <!--!--><a href="counter" class="nav-link"><!--!-->
                <span class="oi oi-plus" aria-hidden="true"></span> Counter
            </a><!--!-->
        </li><!--!-->
        <li class="nav-item px-3"><!--!-->
            <!--!--><a href="fetchdata" class="nav-link"><!--!-->
                <span class="oi oi-list-rich" aria-hidden="true"></span> Fetch data
            </a><!--!-->
        </li><!--!-->
        <li class="nav-item px-3"><!--!--> …