Blazorise使用bootstrap显示属性
Blazorise是一个基于Blazor框架的开源UI组件库，它提供了一套使用Bootstrap样式的组件，用于快速构建漂亮的前端界面。Blazor是一个由Microsoft开发的Web应用程序框架，它允许开发人员使用C#语言进行客户端和服务器端的编程。
Blazorise的主要特点包括：
- 基于Bootstrap样式：Blazorise提供了一套基于Bootstrap的UI组件，使开发人员能够轻松地创建具有现代化外观和响应式设计的界面。
- 简化的语法：Blazorise的组件使用简单且直观的语法，使开发人员能够快速上手并提高开发效率。
- 可自定义的主题：Blazorise允许开发人员根据自己的需求自定义组件的外观和样式，以适应不同的项目需求。
- 跨浏览器支持：Blazorise兼容各种现代浏览器，确保应用程序在不同平台上的一致性和稳定性。
Blazorise的应用场景包括但不限于：
- Web应用程序开发：Blazorise可以用于构建各种类型的Web应用程序，包括管理后台、博客、电子商务平台等。
- 移动应用程序开发：借助Blazor的跨平台特性，可以使用Blazorise构建跨平台的移动应用程序，如混合应用程序或Progressive Web Apps（PWA）。
- 原型设计：Blazorise提供了丰富的UI组件和样式，可以用于快速创建应用程序的原型设计，以便在开发过程中进行迭代和反馈。
对于Blazorise的使用，腾讯云没有直接相关的产品或服务。然而，腾讯云提供了一系列与云计算和Web应用程序开发相关的产品和服务，如云服务器、云数据库、云存储等，可以帮助开发人员构建和部署基于Blazorise的应用程序。您可以访问腾讯云官方网站（https://cloud.tencent.com/）了解更多关于这些产品和服务的详细信息。
相关·内容
在我的blazorise项目中，我一直在使用blazorise控件。我三个月前就开始做这个项目了。现在我想使用Blazorise.Snackbar组件。所以我运行nuget package命令来安装组件。现在我的项目不运行了。它显示了Program.cs文件中以下代码行中的异常
builder.Services.AddBlazorise(options => { options.Immediate = false; })
.AddBootstrap5Providers()
.AddFontAwesomeIcons()
.AddBlazoriseRichTextEd
浏览 25提问于2022-11-03得票数 1
回答已采纳
1回答
我有一个Blazorise手风琴来显示一条工作正常的消息，但是我似乎不能覆盖css填充，这是'CollapseBody‘元素的默认设置。
<Accordion>
<Collapse Visible="message.UIFlag">
<CollapseHeader>
<div class="listitem" @onclick="(
浏览 5提问于2022-07-26得票数 0
回答已采纳
在bootstrap中，我可以像<div class="d-none d-sm-block"></div>一样隐藏在XS设备上。
我在Blazorise中没有看到这个的包装器。是否有一个已知的语法/包装器可以在Blazorise中做同样的事情？如果不是这样，我显然可以使用class属性来完成。
浏览 16提问于2020-05-14得票数 2
回答已采纳
1回答
使用Blazorise bootstrap网格组件时，如何使用ColumnSize属性设置响应式布局选项。我希望小屏幕上的列大小为12。
<Row>
<Column ColumnSize="ColumnSize.Is3">
<StatusSelectListComponent @bind-Text="@_item.Status" OnSave="@ItemEditSave" OnCancel="@ItemEditCancel"&g
浏览 0提问于2020-05-14得票数 2
我有一个无问题的blazor服务器端应用程序。(净核心3.1)。我试着根据中的快速入门页面安装Blazorise。由于我的服务器没有互联网接入，所以我下载了软件包"Blazorise.Bootstrap 0.7.2“和"Blazorise.Icons.FontAwesome 0.9.2.5”。
我可以安装"Blazorise.Icons.FontAwesome“没有错误。但是，如果我试图安装"Blazorise.Bootstrap“，我就会得到错误
"NU1101:无法找到包Microsoft.AspNetCore.Blazor。源代码中没有此id的包:
浏览 6提问于2022-10-20得票数 0
回答已采纳
3回答
如果我具有下列viemodel属性：
public class ExampleViewModel
{
[Required(ErrorMessage = "The email field is required.")]
[EmailAddress(ErrorMessage ="Please enter a valid email address")]
public string Email { get; set; }
[Required(ErrorMessage = "The first name field is requ
浏览 7提问于2020-06-20得票数 0
回答已采纳
我有一个Blazor页面，当我通过URL链接和菜单导航到它时，它工作得很好。但是，一旦进入页面，如果我点击Chrome Refresh按钮，我就会看到我所包含的所有CSS和JS文件的404个错误的长列表。如果我输入URL直接转到页面，也会发生这种情况。Index.razor页面加载正常。A-tags和NavigationManagers也能按预期工作。URL是"https://localhost:5001/OrderEdit/223821“，其中OrderEdit是页面名称，后跟订单号。页面指令如下所示 @page "/OrderEdit"
@page "/O
浏览 73提问于2021-06-22得票数 0
回答已采纳
最近，我开始使用Blazorise作为Blazor中的一个很棒的库。我使用Blazorise DataGrid组件显示我的主/详细数据，您在其中单击主行，而DataGrid显示详细行/行。在last release中，他们给DataGrid添加了一个新事件"RowDoubleClicked“。我如何使用这个新特性并改变DataGrid的自然行为，并在用户双击一行时显示详细信息行/行？
浏览 46提问于2020-04-29得票数 3
回答已采纳
我是Blazor和Blazorise...and的新手，在研究这个组件时，我似乎找不到任何关于如何在Blazorise DataGrid的EditTemplate中绑定TextEdit中的变量的材料。 在我的Blazorise DataGrid中，我有一个DataColumn (参见下面的代码)： <DataGridColumn
Caption="Description"
Editable="true"
TItem="ProductVo"
Field="@nameof(ProductVo.Descr
浏览 23提问于2021-02-10得票数 1
回答已采纳
我有一个Blazor页面的一小部分：
右边是Blazorise FileEdit组件。选择并上传图像后，该图像将显示在占位符中。但我不喜欢大的FileEdit组件，我想隐藏它，并在单击占位符时触发文件选择。触发图像onclick不是问题，但在该图像onclick函数中，我希望触发FileEdit的fileSelect。这个是可能的吗？在Blazorise还是Blazor？
浏览 49提问于2021-02-13得票数 0
我得到了这个错误：enter code hereSystem.TypeLoadException:未能从typeref解析令牌0100001a的类型(在程序集'System.Runtime，Version=4.2.2.0，Culture=neutral，PublicKeyToken=b03f5f7f11d50a3a‘中预期的类'System.Threading.Tasks.Task’)
当我转到：
<TargetFramework>netcoreapp3.1</TargetFramework>
或
<TargetFramework>netc
浏览 5提问于2020-05-21得票数 5
按照这里的升级说明；
WebAssembly项目(以.Server项目、.Shared项目和.Client项目的形式运行)。
当我引用解决方案中的另一个项目时，一切似乎都进行得很好。我希望客户端引用.Shared和另一个类库(这是以前使用过的)。我得到以下错误；
错误BLAZORSDK1001该项目引用ASP.NET核心共享框架，该框架不受WebAssembly应用程序的支持。如果直接引用，则删除框架引用，或者删除添加框架引用的包引用。
我的Client.csproj有以下几点；
<Project Sdk="Microsoft.NET.Sdk.BlazorWebAsse
浏览 2提问于2021-05-26得票数 0
1回答
我是的初学者，我使用Blazorise和Im，但是我正在寻找实现Blazorise图表组件，对于如何实现它有任何想法。没有任何例子
浏览 7提问于2022-07-15得票数 0
回答已采纳
我知道如何使用Blazorise时间编辑组件，但问题是我不知道如何使用它的24小时格式。我将不胜感激，如果你给我一个指南或介绍任何其他组件，我可以用来代替我的Blazorise项目。提前感谢
浏览 31提问于2021-08-01得票数 0
回答已采纳
我正在开发一个门户网站。该网站将在图表中显示一些时间序列数据。对于图表，我使用Blazorise.Charts (1.0.5)。
我想要图表显示完整的日期在一天的开始和之间，只有几个小时(以24小时的格式)和分钟。然而，似乎Blazorise不接受我的输入。
我的数据模型：
public class point
{
public double Value;
public DateTime ReceivedOn;
}
我使用的选项
public LineChartOptions _LineChartOptions { get; set; } = new LineChartOpti
浏览 18提问于2022-06-23得票数 0
我一直在和Blazor和Blazorise图书馆一起做一些工作。我在FF和Chrome的布局上遇到了一个不同之处，这破坏了我的网格的外观
我可以在他们的演示站点上复制它：
如果我..。
，并将编辑模式下拉设置为内联，点击任何行检查第一个元素，更改类.table td类vertical-align: top，使其baseline而不是<code>H 212</code><code>f 213</code>
最后我在FF里说：
这是Chrome：
Chrome中的文本底部是对齐的。在FF中，纯文本"2“很低。
您可能会注意
浏览 2提问于2021-06-30得票数 0
回答已采纳
1回答
我是Blazorise和的初学者，有谁知道如何隐藏饼形图图例吗？
这里是我的代码
<Chart @ref="pieChart" Type="ChartType.Pie" TItem="double" Options="@chartOptions" />
@*Pie chart*@
@code {
private Chart<double> pieChart;
ChartOptions chartOptions = new() { AspectRatio = 0.5 }
浏览 8提问于2022-07-22得票数 0
回答已采纳
我已经使用Visual Studio 2019创建了Blazor服务器端项目。然后我将Blazorise nuget添加到项目中。我遵循Blazorise快速入门添加了using语句、样式表、jquery和注册。不幸的是，一旦我这样做了，项目菜单(即主页，计数器，获取数据)不再有效。我做错了什么？我使用的是.net核心3.1，也尝试了3.0。
谢谢你的帮助。
浏览 2提问于2020-01-16得票数 2
我遇到了Blazorise.DateEdit组件的问题。 datetime值显示在表列的右侧，如下图所示。 ? 现在，在编辑上是不同的故事。首先，这是呈现DateEdit组件的代码 ? 这就是它的结果 ? 如何设置DateEdit组件以显示在模型属性中设置的日期和时间，并将其设置为24小时格式
浏览 95提问于2021-09-04得票数 0
我需要在Blazorise DataGrid (多行)中编辑数据，然后保存网格。有没有包含用于更新数据库的C#函数的代码示例？
浏览 13提问于2020-12-12得票数 1
1回答
我试图使用blazorise数字编辑组分离属性。正如它的文档中所说的，应该可以使用它，但正如我所尝试的那样，它不起作用。如果您能帮助我使用blazorsie组件来分别定义数千位数字，我将不胜感激。例如，当我输入值12345678时，它预先显示了12,345,678 -谢谢
浏览 16提问于2022-10-01得票数 0
回答已采纳
我正在使用Blazorise Bootstrap创建Blazor客户端应用程序。
在我的代码中，我有一个POCO上的基本CRUD弹出窗口。我正在使用Blazorise验证来执行现场要求；
现在我遇到的问题是，我的弹出窗口是可重用的，用于添加和编辑POCOs (从datagrid)。我将验证绑定到一个引用，如下所示；
<Validations @ref="companyValidations" Mode="ValidationMode.Auto">
<Fields>
浏览 8提问于2019-10-22得票数 3
试图让多个自动完成在我的Blazorise项目中工作。希望它一般像这个那样工作。
我输入了Blazorise中给出的代码示例：
@page "/MultipleSelectPage"
<h3>MultipleSelect</h3>
<Autocomplete TItem="Country"
TValue="string"
Data="@Countries"
TextField="@(( item ) =&g
浏览 11提问于2022-07-11得票数 0
我最初有一个工作的 LineChart，它简单地提取了一家公司上周的股价数据，并将其放入一个简单的直线图中。
我想重构这个页面，将LineChart的代码拆分为一个具有部分类的Razor组件，以允许我重用这个组件，添加其他类似的组件，并清理我的代码。
在遵循MSDN文档化 (并且不进行任何功能更改)之后，我在我的控制台中得到以下JSRuntime错误，因此LineChart不再显示：
下面是我的Razor组件的相关代码片段--谁能给我一些关于为什么会出现这个错误的建议？
Index.Razor
@page "/"
@using Stock_Market_Dashboa
浏览 11提问于2020-06-23得票数 0
我正在使用Blazorise，我想在标题文本旁边添加一个可点击的图标(例如，帮助图标)。我看到了DisplayTemplate、EditTemplate等，但是缺少标题模板。
浏览 4提问于2021-06-17得票数 0
对于我的应用程序，我需要一个Select，在这里我收集用户从不同来源选择的一些值。但是用户应该能够以与添加相同的简单方式再次删除值。最好的方法是一个带有小按钮或可点击徽章的SelectItem，以从列表中删除该值。但是无论我尝试什么，都没有用，按钮/徽章是可见的，但是点击它就会被忽略：
<Select TValue="int" Multiple SelectedValues="_selectedWordsForChart" SelectedValuesChanged="@OnSelectedWordsForChartChanged">
浏览 0提问于2022-04-26得票数 0
当我添加一个新的.RAZOR文件时，它将自动被排除在“watch”之外，并且没有生成操作。
我需要手动编辑.CSPROJ文件以删除排除和删除生成操作设置。
使用的工具+扩展：
2019预览版( 16.8.0预览版)Resharper终极版(2020.2.4)编译器(1.12.394) (启用/禁用)
我现在的CSPROJ文件，它是如何工作的：
<Project Sdk="Microsoft.NET.Sdk.Web">
<PropertyGroup>
<TargetFramework>net5.0</Target
浏览 4提问于2020-11-07得票数 1
回答已采纳
有没有办法使用Blazorise中的从列表中选择默认值？现在默认值是null，但我希望它是"3“。
<Select @bind-SelectedValue="@_someProperty">
@foreach (string number in _numbers)
{
<SelectItem Value="@number ">
浏览 5提问于2020-05-21得票数 2
是否有条件地将整行的样式设置为Blazorise？例如，如果Active == false，则使用css将整行灰色化。
.inactive {
text-color: gray;
}
我试图使用RowStyling属性，但我不确定如何使用它(或者它是否可以使用)。如果可以使用，我想将当前的TItem传递给函数。我可以在行级别()设置样式，并使用CSS设置全局行颜色。
浏览 13提问于2022-08-25得票数 1
回答已采纳
1回答
我无法让Blazorise数据网格正确呈现。我已经在gist中包含了这些内容，json会被加载，但不会在网格中呈现。要点如下： https://gist.github.com/bbqchickenrobot/9af26063108beb4acb75e9a9dc5b4ae0
浏览 22提问于2021-01-17得票数 0
回答已采纳
1回答
我在投资跟踪应用程序上工作，这将是免费的，为每个人。我将net Core与blazor和Blazorise一起用于图表。我偶然发现了一个呈现图表的问题。在Blazorise官方文档中，我添加了protected override async Task OnAfterRenderAsync(bool firstRender)方法(参见下面的代码)。此方法应在页面首次呈现时重新绘制图表。问题是这个方法总是触发两次。它在第一次显示图表，第二次将图表保留为空(因为第二次触发时firstRender = false )。如果我删除If块，图表呈现正常。 此外，我还添加了刷新数据+图表的按钮。按下此按钮
浏览 24提问于2021-05-10得票数 0
1回答
我正在使用Blazorise和Bazorise0.9.5.2构建一个新的.NET 6.0应用程序。
按照目前的配置，只有登录用户才能看到局外人布局。匿名用户可以看到整个布局，但这个局外人除外。比较两种情况下的HTTP内容，可以看出匿名用户和登录用户之间唯一的区别是是否存在两个依赖授权的导航条链接，以及“欢迎，用户”和“欢迎用户”的开箱即用的显示。右上角的“登录”。Chrome显示在这两种情况下都没有下载CSS或JS失败。
MainLayout.razor看起来如下所示：
<Layout Sider="true">
<LayoutSider>
浏览 13提问于2021-12-16得票数 0
回答已采纳
最近，我收到一个请求，要求在我的Blazor Server项目中的一个DataGrid中添加Sticky Header功能。我正在使用Blazorise，没有看到任何粘性标题的现有功能，并且在网上找到了有限的信息，所以我想我应该记录我的解决方案。
浏览 16提问于2020-08-04得票数 2
如何在Blazorise DataGrid上强制刷新？该场景是一个页面大小组件将页面大小从5更改为10，并且应该用新的页面大小刷新网格。尽管网格被绑定到PageSize，但ReadData事件不会触发。
浏览 33提问于2020-10-12得票数 0
回答已采纳
我在我的blazorise .Net Core5客户端项目中使用Z.Blazor.Diagrams包版本2.0.0来创建和显示组织结构图。一切都很顺利，我可以创建我的图表了，我的问题是如何以组织结构图的格式显示我的图表。我找过了，但没有找到任何方法。这是我显示图表的代码的一部分：
double x = 0;
double y = 0;
foreach (var item in chartDetail)
{
var node = NewNode(x, y, item.PostTitle, item.Id);
Diagram.Nodes.Ad
浏览 42提问于2021-05-29得票数 0
回答已采纳
我正在尝试编写自己的UI，并使用orchard核心作为后端。我有一个内容类型，其中有一个媒体字段，让人们简历。如果我使用orchard core并创建一个新的内容项，那么一切都很好。以下是问题所在。如何从我自己的UI发送文件？我正在使用blazorise，提前谢谢
浏览 10提问于2021-05-03得票数 0
回答已采纳
代码非常简单：
<a>This is a link</a>
在Bootstrap 4 Alpha 2 中，链接显示为蓝色。当您将鼠标悬停在它上面时，它会显示为深蓝色。
但在Bootstrap4Alpha3 中，它显示为黑色。
在Bootstrap4Alpha3中有没有什么特殊的Bootstrap类可以被添加来让<a>拥有链接风格？
像这样的东西？
<a class="bootstrap-link">This is a link</a>
有没有干净/聪明的方法？
谢谢
浏览 0提问于2016-07-28得票数 5
回答已采纳
我正在使用Blazorise特性()。我通过以下代码跟踪文档：
<Modal @ref="ModalRef1">
<ModalContent Centered>
<ModalHeader>
<ModalTitle>Sample Title</ModalTitle>
</ModalHeader>
<ModalBody>
<Field>
<FieldLabel>Sample Field Content<
浏览 4提问于2022-03-24得票数 0
1回答
嗨，伙计们，我想把abp版本从5.2.2升级到6.0.1。
它的单层web应用程序与blazor服务器。
我执行了abp更新，然后执行了模式、blazor、npm和纱线更新，现在当我运行app时，我从浏览器控制台获得了这条错误消息。
rror: System.InvalidOperationException: Unable to set property 'Clicked' on object of type 'Blazorise.BarDropdownItem'. The error was: Unable to cast object of type &#
浏览 8提问于2022-12-03得票数 0
如何在运行时设置单元的前置颜色？例如，我希望根据天气预报应用程序的Temp.C.单元格的值设置它们的止赎颜色，
如果值小于零，则颜色应设置为Blue；
如果一个值介于0到19之间，那么颜色应该设置为Orange；
否则-颜色应设置为红色；
@page "/fetchdata"
<PageTitle>Weather forecast</PageTitle>
@using BlazoriseDemo.Data
@using Blazorise;
@inject WeatherForecas
浏览 17提问于2022-08-10得票数 0
回答已采纳
我正在尝试使用Bootstrap4和VueJS单页应用程序，但不知道如何让正常工作。(注意:我知道有一个Bootstrap-vue项目，但我不想使用那个one...yet)
下面是我的简单测试：
<template>
<div>
<span id='tip'>Test link</span>
</div>
</template>
<script>
import $ from 'jquery';
import 'bootstrap/dist/css/boo
浏览 32提问于2018-08-12得票数 0
回答已采纳
我找到了一个我想要使用的卡片轮播的代码笔示例。但是，bootstrap样式表使转盘无法正常工作。当我移除样式表时，旋转木马可以工作，但它会改变该页面的样式，我需要它与其他页面保持一致。
这是我在carousel卡中使用的代码笔示例。
我使用的代码与上面链接中的示例中显示的代码完全相同
<!-- I can only keep the 2 style sheet below and maintain my personal styling
but the card carousel will not work-->
<link href="bootstrap/cs
浏览 0提问于2019-10-16得票数 2
很抱歉，如果这是一个Blazorise问题，而不仅仅是一个普通的WebAseembly问题，我只是不确定这两个标记都是noob，所以我不确定用这两个标记发布，但是我想在具有特定列可排序的DataGrid中显示一个条目列表(一次多列，而不是一次只有一个)，一旦出现了可排序列desc/asc/ do方向设置，我希望能够在一个按钮上读取它们的设置方向属性状态，然后将其传递给另一个component...only，我无法使用这样的@ref：
<DataGrid TItem="Item"
Data="@ItemList"
@r
浏览 11提问于2022-01-21得票数 1
在使用大数据集方法时，有没有人有使用DataGridAggregates (列总数)的Blazorise DataGrid的示例？ 当我尝试时，没有出现页脚： <DataGrid TItem="CustomerOrderSummaryDto"
Data="@PagedResults?.Results"
ReadData="@OnReadDataAsync"
TotalItems="@PagedResults?.TotalCount"
Aggre
浏览 26提问于2020-11-04得票数 2
回答已采纳
我有一个Blazorise EditTemplate这样：
<EditTemplate>
<Select TValue="int" SelectedValue="@((int)( context.CellValue ))" SelectedValueChanged="@(( v ) => context.CellValue = v)">
<SelectItem TValue="int" Value=&
浏览 12提问于2021-04-19得票数 0
回答已采纳
我知道怎么显示装货...用户单击Bootstrap按钮时的文本。我就是这样做的
add two dependency files
1) bootstrap.min.css
2) bootstrap.min.js
<button class="btn" id="button" data-text-loading="Loading...">Press Me</button>
$('#button').button();
$('#button').click(function() {
浏览 0提问于2013-09-02得票数 3
回答已采纳
我是个新手，正在尽我所能地阐明这一点。有如此多的新概念需要掌握！如果我说得不清楚，请告诉我。 我正在做一个Todo应用程序作为练习。在页面加载时，我从数据库中获取待办事项，并在foreach循环中迭代它们，每个待办事项都会被分配一个X按钮来删除。这很简单，但为了修改todo文本，我想要一个更新按钮，它会弹出Blazorise的模式弹出窗口，使用它的输入栏。 我的问题是，对于每个按钮，我不知道如何将每个todo项的id传递到这个模式中。对于remove按钮，我可以使用foreach循环的"todoItem.Id“变量，但是Blazorise模式是我不能使用的另一个组件。 下面是我的索引
浏览 16提问于2020-11-18得票数 0
回答已采纳
我正在尝试使用示例进行分页。
我已经到了可以显示新页码的阶段，但不能触发单击事件。在下面的示例中，如何在寻呼机上触发data-ng-click="setPage()"
<!doctype html>
<html ng-app="PagingModule">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.js"><
浏览 0提问于2013-09-07得票数 3
回答已采纳
当单击链接(或按钮)以显示可忽略的弹出窗口时，所单击元素的边框将突出显示。实际上，这发生在引导程序文档和我的页面中的example中。(仅供参考，我计划用图像替换文本“i”；我的假设是突出显示的元素是href，而不是文本。) Bootstrap 5文档可忽略弹出按钮 ? 我的DismissIble弹出窗口 ? 在Bootstrap Docs示例中，单击按钮时会将以下内容添加到元素中： aria-describedby="popover808202" 我的代码 <div class="tile-title">
Modified&l
浏览 23提问于2021-09-29得票数 0
回答已采纳
1回答
我正在使用Blazorise卡组件，代码如下：
.infobox {
border-radius: 20px;
}
<Card Class="infobox">
<CardImage Source="/assets/images/gallery/9.jpg" Alt="Placeholder image">
</CardImage>
<CardBody>
<CardTitle Size="5">Card title</
浏览 5提问于2020-06-09得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
