组件介绍
EditorForm 组件是一个非常实用的组件，当进行数据编辑时，仅需要将 Model 属性赋值即可。
绑定模型默认自动生成全部属性，可以通过设置
AutoGenerateAllItem更改为不自动生成如不需要编辑列，设置
Editable即可，默认值为true生成编辑组件复杂编辑列，设置
EditTemplate模板，进行自定义组件进行编辑表单内按钮可以设置多个，设置
Buttons模板即可
默认情况下，我们只需要绑定Model就可以了，最基础的代码可以只有一行。
<EditorForm Model="@Model">
</EditorForm>会显示Model中的所有字段。
另外我们可以通过绑定内容来做其他的处理。
这个例子的代码如下：
<EditorForm Model="@Model">
<FieldItems>
<EditorItem @bind-Field="@context.Education" Editable="false" />
<EditorItem @bind-Field="@context.Complete" Editable="false" />
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbys" />
</FieldItems>
<Buttons>
<Button Icon="fa fa-save" Text="提交" />
</Buttons>
</EditorForm>其中，我们通过 EditorItem配置Education、Complete在EditorForm中不显示，并且配置Hobby为复选框组，并且指定可选内容。
组件的其他属性
Model：绑定的数据模型。
FieldItems：绑定的列模板，可以对每列进行单独处理。
Buttons：按钮模板，处理内部的按钮。
IsDisplay：是否显示为Display控件，默认为false
ShowLabel：是否显示Label，默认为true。
ShowLabelTooltip：是否在鼠标停留时显示全部信息，默认不显示。
AutoGenerateAllItem：是否生成全部字段。默认为ture。当设置为false的时候，则需要在FieldItems中自己设置所有需要显示的内容。
一个例子是：
<EditorForm Model="@Model" AutoGenerateAllItem="false">
<FieldItems>
<EditorItem @bind-Field="@context.Name" />
<EditorItem @bind-Field="@context.Count" />
</FieldItems>
</EditorForm>这样就只显示Name和Count两个字段。
ItemsPerRow：每行显示组件数量，默认一行只显示一个控件。
RowType：组件布局方式，可选值为Row|Inline，默认值为Row。
LabelAlign：在Inline模式下标签的对齐方式，可选值有 None|Left|Center|Right
EditorItem 的属性
Field：绑定的字段。
FieldType：绑定字段的类型。如果绑定字段时使用了@bind-Field，这里会自动推断类型，可以不写FieldType。
Editable：是否允许编辑，默认为true。
Readonly：是否只读。
Text：前端标签的名字，ShowLabel为true的时候显示。
EditTemplate：自定义编辑模板。
一个例子：
<EditorForm Model="Model" AutoGenerateAllItem="false">
<FieldItems>
<EditorItem @bind-Field="@context.Name" />
<EditorItem @bind-Field="@context.Address" />
<EditorItem @bind-Field="@context.Count">
<EditTemplate Context="value">
<div class="col-12 col-sm-6">
<Select SkipValidate="true" @bind-Value="@value.Count" Items="@DummyItems" ShowSearch="true" />
</div>
<div class="col-12 col-sm-6">
<BootstrapInput Value="@value.Count" Readonly="true" />
</div>
</EditTemplate>
</EditorItem>
<EditorItem @bind-Field="@context.Hobby" Items="@Hobbys" />
</FieldItems>
<Buttons>
<Button ButtonType="ButtonType.Submit" Icon="fa fa-save" Text="提交" />
</Buttons>
</EditorForm>这个例子中，我们给Count字段添加了EditTemplate，然后所以我们在EditorTemplate里可以自由处理Count，添加其他组件，只要保证最后bind修改Count即可。
发表评论