选择框 (Select)

下拉选择框组件。

概述

  • 支持4种列表项数据源
    • 数据字典类别
    • 逗号分割的字符串
    • CodeInfo类数组
    • CodeAction函数

代码演示

1.默认示例

namespace WebSite.Docus.Inputs.Selects;

class Select1 : BaseComponent
{
    private readonly string Codes = "孙膑,后羿,妲己";
    private readonly CodeInfo[] Items = new CodeInfo[]
    {
        new CodeInfo("1", "辅助"),
        new CodeInfo("2", "射手"),
        new CodeInfo("3", "法师")
    };

    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        //Codes属性设置列表项
        //该值为数据字典类别或逗号分割的字符串
        builder.Field<Select>("示例1:", "Select1").Set(f => f.Codes, Codes).Build();
        //Items属性设置列表项
        builder.Field<Select>("示例2:", "Select2").Set(f => f.Items, Items).Build();
        //赋值
        builder.Field<Select>("示例3:", "Select3").Value("孙膑").Set(f => f.Codes, Codes).Build();
        builder.Field<Select>("示例4:", "Select4").Value("3").Set(f => f.Items, Items).Build();
    }
}

2.事件示例

namespace WebSite.Docus.Inputs.Selects;

class Select2 : BaseComponent
{
    private string? message;

    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        //ValueChanged事件
        builder.Field<Select>("英雄:", "Select").ValueChanged(OnValueChanged)
               .Set(f => f.Codes, "孙膑,后羿,妲己")
               .Build();
        builder.Div("tips", message);
    }

    private void OnValueChanged(string value)
    {
        message = value;
        StateChanged();
    }
}

3.控制示例

namespace WebSite.Docus.Inputs.Selects;

class Select3 : BaseComponent
{
    private Select? select;

    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        builder.Component<FieldControl>()
               .Set(c => c.OnVisibleChanged, OnVisibleChanged)
               .Set(c => c.OnEnabledChanged, OnEnabledChanged)
               .Set(c => c.OnReadOnlyChanged, OnReadOnlyChanged)
               .Set(c => c.SetValue, SetValue)
               .Set(c => c.GetValue, GetValue)
               .Build();

        builder.Field<Select>("英雄:", "Select")
               .Set(f => f.Codes, "孙膑,后羿,妲己")
               .Build(value => select = value);
    }

    private void OnVisibleChanged(bool value) => select?.SetVisible(value);
    private void OnEnabledChanged(bool value) => select?.SetEnabled(value);
    private void OnReadOnlyChanged(bool value) => select?.SetReadOnly(value);
    private void SetValue() => select?.SetValue("孙膑");
    private string? GetValue() => select?.Value;
}