Skip to content

Handling EventCallBacks #6

@baileyjs78

Description

@baileyjs78

I have several components that take in a method as an EventCallBack
(think a button inside the component that will run a method outside the component)

I figured out how to pass in normal parameters, and could even pass in a generic EventCallBack, but not sure how to pass in a specific EventCallBack that I can then test the result of

ie.. I want to know that when I click the Edit button, another method is called with a param

@foreach (var movie in movies)
{
    <div class="col-sm-4" @key="movie.Id">
        <div class="card mt-3">
            <div class="card-body">
                <h4 class="card-title">@movie.Title</h4>
                <h6 class="card-subtitle mb-2 text-muted">@movie.Year - @movie.Director</h6>
                <p class="card-text">
                    @movie.Description
                </p>
                <button class="btn btn-primary" @onclick="(() => OnEditEvent.InvokeAsync(movie.Id))">Edit</button>
                <button class="btn btn-secondary" @onclick="(() => OnDeleteEvent.InvokeAsync(movie))">Delete</button>
            </div>
        </div>
    </div>
}
@code {
    [Parameter]
    public List<Movie> movies { get; set; }
    [Parameter]
    public EventCallback<Guid> OnEditEvent { get; set; }
    [Parameter]
    public EventCallback<Movie> OnDeleteEvent { get; set; }
}```

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions