简体   繁体   中英

Blazor pass variable and call event from .razor on a html created using RenderTreeBuilder on a C# class

I'm creating a tree structure using Blazor and I need to get the value of the node clicked and send it to a function on the View to remove it from the tree.

This is the C# code that is generating the tree:

BinaryTreeService.cs

public void PreOrderTraversal(RenderTreeBuilder builder, BinaryTreeNode node)
    {
        if (node != null)
        {
            //Some Code

            builder.OpenElement(2, "a");
            builder.AddAttribute(2, "href", "javascript: void(0)");
            builder.AddAttribute(2, "value", node.Value);
            builder.AddAttribute(3, "onclick", EventCallback.Factory.Create(this, -->Remove(value)<--));
            builder.AddContent(2, node.Value);
            builder.CloseElement();

            PreOrderTraversal(builder, node.Left);
            PreOrderTraversal(builder, node.Right);

            //Some Code
        }
    }

Where is the -->Remove(value)<-- I want to call a function and pass a value.

BinaryTree.razor

public void Remove(int value)
{
   //remove
}

How can I achieve it? I know how to call a function in the.cs but I don't know how to call one in the.razor, also I have no idea how to get the value from the anchor tag using this approach.

i use this simple code, but i use razor component not use element.

mybutton.razor

@code {
    [Parameter]
    public int Value {get;set;}
    [Parameter]
    public EventCallback<int> AnswerEvent { get; set; }

    public void PressButtonOk()
    {
        AnswerEvent.InvokeAsync(Value);
    }
}

<div @onclick="PressButtonOk">OK</div>

MyCode.cs

public void PreOrderTraversal(RenderTreeBuilder builder, BinaryTreeNode node)
{
    if (node != null)
    {
        builder.OpenControl(0, "mybutton");
        builder.AddAttribute(0, "Value", node.Value);
        builder.AddAttribute(0, "onclick", EventCallback.Factory.Create<int>(this, Remove(value)));
        builder.CloseControl();
    }
}
public void Remove(int value) { }

Good luck

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM