Blazor步进概述

开拓者的一步是一个组件,它呈现由朝向更大动作的逻辑步骤序列形成的路径。Stepper通过显示用户完成该操作的剩余步骤来指示用户在该操作中的进度。它将漫长的过程分解成更小的部分,从而让用户体验变得更轻松。

Stepper提供了几个开箱即用的功能,包括定义每个功能的外观的能力一步验证对于步骤,严格线性流而且一步模板使它符合任何设计要求。

为Blazor Ninja图像的Telerik UI

步进组件是为Blazor的Telerik UI,一个具有100个本地组件的专业级UI库,用于构建现代和功能丰富的应用程序。想要试用它,请注册一个30天的免费试用。

创建Blazor步进

  1. 添加TelerikStepper标记将组件添加到剃须刀页面。

  2. 设置价值参数(int)来定义当前步长索引。它支持单向和双向绑定。

  3. 添加StepperStep实例StepperSteps标签。

  4. (可选)设置图标而且标签StepperStep属性。

stepp组件的简单设置。

@*简单的步骤设置。*@ 
< telerikstepp @bind- value ="@ currentstepindex ">< stepstep> < stepstepicon ="preview" Label=" preview" > < stepstepicon ="track-change -accept" Label="Finish Order">
@code {public intCurrentStepIndex {get;设置;} = 2;}

步骤

Steps是steper组件的构建块。添加所需的步骤StepperStep标记每一步。然后,配置每个StepperStep外观通过它的参数。阅读有关Blazor Steps配置的更多信息

取向

steper组件提供水平和垂直方向。阅读更多关于Blazor步进定向

显示模式

步骤可以显示标签和图标。阅读更多关于Blazor步进显示模式

线性流

默认情况下,用户可以选择steper组件中的任何步骤并直接转到它。方法可以更改此行为线性参数,以便用户按顺序执行这些步骤。阅读更多关于Blazor步进线性流

模板

您可以使用内置模板的功能,并自定义呈现为步骤的内容。阅读更多关于Blazor steper模板的信息

事件

Blazor steper生成您可以处理并进一步定制其行为的事件。阅读更多关于Blazor Stepper事件的信息

步进参数

Blazor steper提供了各种参数,允许您配置组件:

参数 类型及默认值 描述
价值 int 定义当前步骤索引。
取向 StepperOrientation枚举
水平
定义步进器的方向。您可以阅读更多关于如何配置它的信息取向篇文章。
线性 保龄球 启用/禁用线性流
StepType StepperStepType枚举
步骤
定义步进的显示模式。您可以阅读更多关于如何配置它的信息显示模式篇文章。

下一个步骤

另请参阅

在本文中
Baidu
map