Blazor子组件

时间:2019-02-25 23:52:56

标签: asp.net-core single-page-application blazor

我正在寻找一种将隐式参数从父组件传输到子组件的方法。让我解释一下:我已经编码了一个名为InputValidation的组件,以使用我们可以设置的条件来验证输入(由Property绑定)。

昨天,我问StackOverflow社区如何获取每个子组件的引用(首先是反射)。这里的主题=> Blazor get nested components by Reflection

顺便说一句,再次感谢帮助我的贡献者。

现在,我想将另一个chid组件嵌套到此InputValidation中。像这样:

<InputValidation ref="@InputValidationRef" Property="@lang.Value">
    <ValidationCase TItem="string" On="@(x => !string.IsNullOrEmpty(x))" Message="Test message" />
    <ValidationCase TItem="string" On="@(x => x == "A text")" Message="Test message" />
</InputValidation>

我这样编码我的组件:

InputValidation

@using System.Linq.Expressions;

@typeparam TItem

    @*<span class="form-text text-danger">@Message</span>*@
    <CascadingValue Value="Property">
        <div>
            @ChildContent
        </div>
    </CascadingValue>

@functions {

    [Parameter]
    TItem Property { get; set; }

    [Parameter]
    public RenderFragment<ValidationCase<TItem>>[] ChildContent { get; private set; }

    public bool Valid { get; set; }
}

ValidationCase

@using System.Linq.Expressions;

@typeparam TItem

<span id="test" class="form-text text-danger">@Message</span>

@functions {

    [CascadingParameter]
    private TItem Property { get; set; }

    [Parameter]
    protected Expression<Func<TItem, bool>> On { get; set; }

    [Parameter]
    protected string Message { get; set; }

    internal bool Valid { get; set; }

    protected async override Task OnParametersSetAsync()
    {
        Valid = !On.Compile().Invoke(Property);
    }
}

我想知道的事情:

  • 这种方法有效吗?
  • 有没有一种方法不能在ValidationCase声明中显式调用TItem =“ string”?如果我们不这样做,则不能推导出表达式参数类型。即使通过插入CascadingValue来做到这一点。

感谢您的回复。

修改03/01:

我不得不以不同的方式进行。我没有使用View for ValidationCase,而是使用仅代码的组件名称ValCase

[Route("val-case")]
public class ValCase<TItem> : ComponentBase
{
    [CascadingParameter]
    private InputValidation<TItem> parent { get; set; }

    [Parameter]
    protected Expression<Func<TItem, bool>> On { get; set; }

    [Parameter]
    protected string Message { get; set; }

    internal bool Valid { get; set; }

    protected override void BuildRenderTree(RenderTreeBuilder builder)
    {
        var seq = 0;
        builder.OpenElement(++seq, "li");
        builder.OpenElement(++seq, "span");
        builder.AddAttribute(++seq, "id", "test");
        builder.AddAttribute(++seq, "class", "form-text text-danger");
        builder.AddContent(++seq, Message);
        builder.CloseElement();
        builder.CloseElement();
    }

    protected override void OnInit()
    {
        parent.Items.Add(this);
    }

    protected override bool ShouldRender()
    {
        return true;
    }

    protected async override Task OnParametersSetAsync()
    {
        Valid = !On.Compile().Invoke(parent.Property);
    }
}

渲染还可以...但是只是第一次。每次更新属性值时,不再渲染ValCase。我将Console.WriteLine放入OnParametersSetAsync方法中,但似乎不再调用此方法。

有人可以帮助我找到解决方法吗?

0 个答案:

没有答案