Blazor 函数被执行了，我不知道为什么

我是blazor的新手，我有一个不明白的问题

我编写了一个简单的测试应用程序，可以在其中创建联系人、文章和发票。这很有效。在发票中，我可以通过打开一个模式并选择一些物品来创建发票行项目，这些物品将获得新的发票行项目

现在我有两个问题：

当我删除最后一个发票行项目时，它工作，但当我删除最后一个项目以外的另一个项目时，将执行功能

SaveInvoice

如果我将模式的代码放入

-标记中，则也会执行

保存发票

功能。如果我将模态放在

标记之外，它将按预期工作，但我希望将其放在表单内部

为什么执行此代码时没有显式调用？我想这是一种含蓄的呼唤，但我不明白它从何而来

你能帮我还是给我一个提示？还是你需要更多的信息

调用发票表单的代码：

@page "/invoice/edit/{rechnungID:int}"
@inject NavigationManager navMan
@inject IJSRuntime js
@inject IInvoiceRepository invoiceRepository
@inject IArticleRepository articleRepository

<h3>Rechnung bearbeiten</h3>

<FormInvoice ButtonText="Aktualisieren" Artikel="@Artikel" Rechnung="@Rechnung" Positionen="@Positionen" OnValidSubmit="@SaveInvoice" EditMode="true" OnCancel="@Cancel" OnRemoveItem="@RemoveItem" />


@code {
    [Parameter] public int rechnungID { get; set; }
    Rechnung Rechnung = new Rechnung();
    List<Rechnungsposition> Positionen { get; set; } = new List<Rechnungsposition>();
    List<Artikel> Artikel { get; set; } = new List<Artikel>();

    protected async override Task OnInitializedAsync()
    {
        Rechnung = await invoiceRepository.GetInvoiceByID(rechnungID);
        Positionen = Rechnung.Positionen;
        Artikel = await articleRepository.GetArticles();
    }

    async Task SaveInvoice() // This gets executed and i dont know why
    {
        await invoiceRepository.UpdateInvoice(Rechnung);
        await js.InvokeVoidAsync("alert", $"Erfolgreich aktualisiert!");
        navMan.NavigateTo("invoice");
    }

    void Cancel() => navMan.NavigateTo("invoice");

    private void RemoveItem(Rechnungsposition pos)
    {
        Positionen.Remove(pos);
    }
}

@inject IModalService Modal
@inject IArticleRepository articleRepository
@inject IInvoiceRepository invoiceRepository
@inject IInvoiceLineItemRepository itemsRepository


<EditForm Model="@Rechnung" OnValidSubmit="@OnValidSubmit">
    <DataAnnotationsValidator />
    <div class="form-group row">
        <label class="col-sm-1 col-form-label" for="inputReNr">Rechnungsnr:</label>
        <div class="col-sm-2">
            @if (EditMode)
            {
                <InputText id="inputReNr" class="form-control-plaintext" @bind-Value="@Rechnung.RechnungsNr" readonly />
            }
            else
            {
                <InputText id="inputReNr" class="form-control" @bind-Value="@Rechnung.RechnungsNr" />
                @*<ValidationMessage For="@(() => Rechnung.RechnungsNr)" />*@
            }
        </div>
        <label class="col-sm-1 col-form-label" for="inputReDatum">Datum:</label>
        <div class="col-sm-2">
            <InputDate id="inputReDatum" class="form-control" @bind-Value="@Rechnung.RechnungsDatum" />
            <ValidationMessage For="@(() => Rechnung.RechnungsDatum)" />
        </div>
    </div>

    <div class="form-group row">
        <label class="col-sm-1 col-form-label" for="inputAdresse">Adresse:</label>
        <div class="col-sm-5">
            <InputTextArea id="inputAdresse" class="form-control" @bind-Value="@Rechnung.Adresse" />
            <ValidationMessage For="@(() => Rechnung.Adresse)" />
        </div>
    </div>


    <SelectedInvoiceLineItems Positionen="@Positionen" OnRemoveItem=@RemoveItem />

    <div class="form-group row">
        <label>Nettosumme</label>
        <label>@Rechnung.NettoSumme</label>
    </div>
    <div class="form-group row">
        <label>zzgl USt</label>
        <label>@Rechnung.UStSumme</label>
    </div>
    <div class="form-group row">
        <label>Bruttosumme</label>
        <label>@Rechnung.BruttoSumme</label>
    </div>
</EditForm>

@*When the modal is here the SaveInvoice-function is not exceuted, but when i place it inside <EditForm> it gets executed*@
@if (EditMode)
{
    <button @onclick="ShowModal" class="bg-gray-100 hover:bg-blue-200 text-gray-800 font-semibold py-2 px-4 border border-gray-400 rounded shadow">Neue Position</button>
}

<div class="form-group row">
    <button class="btn btn-success mr-2" @onclick="@OnValidSubmit">
        @ButtonText
    </button>
    <button class="btn btn-secondary" @onclick="@OnCancel">Abbrechen</button>
</div>


@code {
    int RechnungID { get; set; }
    [Parameter] public Kontakt Kontakt { get; set; }
    [Parameter] public Rechnung Rechnung { get; set; }
    [Parameter] public List<Artikel> Artikel { get; set; } = new List<Artikel>();
    [Parameter] public List<Rechnungsposition> Positionen { get; set; } = new List<Rechnungsposition>();
    [Parameter] public string ButtonText { get; set; } = "Speichern";
    [Parameter] public EventCallback OnValidSubmit { get; set; }
    [Parameter] public EventCallback OnCancel { get; set; }
    [Parameter] public EventCallback<Rechnungsposition> OnRemoveItem { get; set; }
    [Parameter] public bool EditMode { get; set; }

    protected override void OnInitialized()
    {
        if (!EditMode)
        {
            Rechnung = new Rechnung();
        }
        else
        {
            RechnungID = Rechnung.ID;
        }
    }

    protected override void OnParametersSet()
    {
        if (!EditMode)
        {
            Rechnung.Adresse = Kontakt.Name;
            Rechnung.KontaktID = Kontakt.ID;
            Rechnung.IstBezahlt = false;
        }
    }

    async Task ShowModal()
    {
        var parameters = new ModalParameters();
        parameters.Add(nameof(SelectArticle.Artikel), Artikel);
        parameters.Add(nameof(SelectArticle.RechnungID), Rechnung.ID);
        parameters.Add(nameof(SelectArticle.Positionen), Positionen);
        var options = new ModalOptions()
        {
            DisableBackgroundCancel = true,
            HideCloseButton = true
        };
        var messageForm = Modal.Show<SelectArticle>("Artikel auswählen", parameters, options);
        var result = await messageForm.Result;

        if (result.Cancelled)
        {
            //Console.WriteLine("Modal was cancelled");
        }
        else
        {
            //Console.WriteLine($"Anzahl Positionen nach Modal: {Positionen.Count}");
        }

    }

    private async Task RemoveItem(Rechnungsposition pos)
    {
        await OnRemoveItem.InvokeAsync(pos);
    }
}

@page”/invoice/edit/{rechnungID:int}
@注入导航管理器navMan
@注入IJSRuntime js
@注入IINVoicePository发票存储库
@注入IArticleRepository Article存储库
比尔贝滕酒店
@代码{
[参数]public int rechnungID{get；set；}
Rechnung Rechnung=新Rechnung（）；
列表位置en{get；set；}=new List（）；
列表
洛申
}
@代码{
[参数]公共列表位置en{get；set；}=new List（）；
[参数]公共事件回调OnRemoveItem{get；set；}
专用异步任务删除项（Rechnungsposition pos）
{
等待OnRemoveItem.InvokeAsync（pos）；
}
}

模式代码：

@if (Artikel == null)
{
    <text>Lade Daten...</text>
}
else if (Artikel.Count == 0)
{
    <text>Keine Daten gefunden.</text>
}
else
{
    <table class="table table-sm table-hover table-bordered">
        <thead>
            <tr>
                <th scope="col"></th>
                <th scope="col">Bezeichnung</th>
                <th scope="col">Einheit</th>
                <th scope="col">Stückkosten</th>
                <th scope="col"></th>
            </tr>
        </thead>
        <tbody>
            @foreach (Artikel art in Artikel)
            {
                <tr>
                    <td scope="row"><Input type="checkbox" @onchange="eventArgs => { ArtikelClicked(art, eventArgs.Value); }" /></td>
                    <td scope="row">@art.Bezeichnung</td>
                    <td scope="row">@art.Einheit</td>
                    <td scope="row">@art.Stueckkosten</td>
                </tr>
            }

        </tbody>
    </table>

    <button @onclick="@Anlegen" class="btn btn-primary">Anlegen</button>
    <button @onclick="@Cancel" class="btn btn-secondary">Abbrechen</button>
}

@code 
{
    [CascadingParameter] BlazoredModalInstance BlazoredModal { get; set; }
    [Parameter] public List<Artikel> Artikel { get; set; }
    [Parameter] public int RechnungID { get; set; }
    private List<Artikel> ArtikelAuswahl = new List<Artikel>();
    [Parameter] public List<Rechnungsposition> Positionen { get; set; }


    void ArtikelClicked(Artikel artikel, object checkedValue)
    {
        if ((bool)checkedValue)
        {
            if (!ArtikelAuswahl.Contains(artikel))
            {
                ArtikelAuswahl.Add(artikel);

            }
        }
        else
        {
            if (ArtikelAuswahl.Contains(artikel))
            {
                ArtikelAuswahl.Remove(artikel);
            }
        }

    }

    void Anlegen()
    {
        Rechnungsposition position;
        for (int i = 0; i < ArtikelAuswahl.Count; i++)
        {
            position = new Rechnungsposition();
            position.ID = 0;
            position.RechnungID = RechnungID;
            position.ArtikelID = ArtikelAuswahl[i].ID;
            position.Anzahl = 1;
            position.Beschreibung = ArtikelAuswahl[i].Beschreibung;
            position.Bezeichnung = ArtikelAuswahl[i].Bezeichnung;
            position.Einheit = ArtikelAuswahl[i].Einheit;
            position.Stueckpreis = ArtikelAuswahl[i].Stueckkosten;
            position.Gesamtpreis = ArtikelAuswahl[i].Stueckkosten;
            Positionen.Add(position);
        }

        BlazoredModal.Close(ModalResult.Ok(true));
    }

    void Cancel()
    {
        Console.WriteLine("Cancel");
        BlazoredModal.Cancel();
    }
}

@if（Artikel==null）
{
拉德达滕。。。
}
else if（Artikel.Count==0）
{
基恩·达滕·格芬登。
}
其他的
{
名称
统一体
Stückkosten
@foreach（Artikel中的Artikel艺术）
{
@贝泽希农艺术
@艾因海特美术馆
@斯图埃科斯顿美术馆
}
安勒根
取消
}
@代码
{
[CascadingParameter]BlazoredModalInstance BlazoredModal{get；set；}
[参数]公共列表Artikel{get；set；}
[参数]public int RechnungID{get；set；}
私有列表ArtikelAuswahl=新列表（）；
[参数]公共列表位置{get；set；}
作废Artikel单击（Artikel Artikel，对象检查值）
{
如果（（bool）checkedValue）
{
如果（！ArtikelAuswahl.包含（artikel））
{
ArtikelAuswahl.Add（artikel）；
}
}
其他的
{
if（ArtikelAuswahl.Contains（artikel））
{
ArtikelAuswahl.移除（artikel）；
}
}
}
void Anlegen（）
{
再定位位置；
对于（int i=0；i

将按钮类型设置为简单的“按钮”，默认值通常为“提交”

Neue位置

从

提示：始终为元素指定类型属性。不同的浏览器可能会对元素使用不同的默认类型

---

您是否尝试过调试和检查调用堆栈以查看谁调用了SaveInvoice非常感谢。我花了几个小时试图找出问题所在。我从来没有想到它可能是那种类型。

@if (Artikel == null)
{
    <text>Lade Daten...</text>
}
else if (Artikel.Count == 0)
{
    <text>Keine Daten gefunden.</text>
}
else
{
    <table class="table table-sm table-hover table-bordered">
        <thead>
            <tr>
                <th scope="col"></th>
                <th scope="col">Bezeichnung</th>
                <th scope="col">Einheit</th>
                <th scope="col">Stückkosten</th>
                <th scope="col"></th>
            </tr>
        </thead>
        <tbody>
            @foreach (Artikel art in Artikel)
            {
                <tr>
                    <td scope="row"><Input type="checkbox" @onchange="eventArgs => { ArtikelClicked(art, eventArgs.Value); }" /></td>
                    <td scope="row">@art.Bezeichnung</td>
                    <td scope="row">@art.Einheit</td>
                    <td scope="row">@art.Stueckkosten</td>
                </tr>
            }

        </tbody>
    </table>

    <button @onclick="@Anlegen" class="btn btn-primary">Anlegen</button>
    <button @onclick="@Cancel" class="btn btn-secondary">Abbrechen</button>
}

@code 
{
    [CascadingParameter] BlazoredModalInstance BlazoredModal { get; set; }
    [Parameter] public List<Artikel> Artikel { get; set; }
    [Parameter] public int RechnungID { get; set; }
    private List<Artikel> ArtikelAuswahl = new List<Artikel>();
    [Parameter] public List<Rechnungsposition> Positionen { get; set; }


    void ArtikelClicked(Artikel artikel, object checkedValue)
    {
        if ((bool)checkedValue)
        {
            if (!ArtikelAuswahl.Contains(artikel))
            {
                ArtikelAuswahl.Add(artikel);

            }
        }
        else
        {
            if (ArtikelAuswahl.Contains(artikel))
            {
                ArtikelAuswahl.Remove(artikel);
            }
        }

    }

    void Anlegen()
    {
        Rechnungsposition position;
        for (int i = 0; i < ArtikelAuswahl.Count; i++)
        {
            position = new Rechnungsposition();
            position.ID = 0;
            position.RechnungID = RechnungID;
            position.ArtikelID = ArtikelAuswahl[i].ID;
            position.Anzahl = 1;
            position.Beschreibung = ArtikelAuswahl[i].Beschreibung;
            position.Bezeichnung = ArtikelAuswahl[i].Bezeichnung;
            position.Einheit = ArtikelAuswahl[i].Einheit;
            position.Stueckpreis = ArtikelAuswahl[i].Stueckkosten;
            position.Gesamtpreis = ArtikelAuswahl[i].Stueckkosten;
            Positionen.Add(position);
        }

        BlazoredModal.Close(ModalResult.Ok(true));
    }

    void Cancel()
    {
        Console.WriteLine("Cancel");
        BlazoredModal.Cancel();
    }
}

<button type="button" @onclick="ShowModal" ...>Neue Position</button>