当我点击取消时,流程进入我的取消方法,但之后进入我的保存操作?啊?为什么?(仅供参考:这是父组件的子组件)
<h3>EditPage</h3>
@inject AppState _appState
@inject IJSRuntime _jsRuntime
<div class="container">
<EditForm Model="@_model" OnValidSubmit="@Save">
<div class="row">
<div class="col">
<button type="submit" class="btn btn-primary">Save</button>
<button @onclick="CancelEdit" class="ms-3 btn btn-secondary">Cancel</button>
<button @onclick="()=>Delete(new MyClass())" class="ms-3 btn btn-danger">Delete</button>
</div>
</div>
</EditForm>
</div>
@code {
[Parameter] public EventCallback<string> OnClick { get; set; }
MyClass? _model;
async Task Delete(MyClass item)
{
if (!await _jsRuntime.InvokeAsync<bool>("confirm", $"Are you sure you want to delete item?"))
return;
//do delete
_appState.IsEdit = false;
_appState.EditingId = "";
}
protected override void OnInitialized()
{
_model = new();
}
void CancelEdit()
{
_appState.IsEdit = false;
_appState.EditingId = "";
OnClick.InvokeAsync("Cancel action occurred");
}
void Save()
{
//persist work Add or Update
_appState.IsEdit = false;
_appState.EditingId = "";
OnClick.InvokeAsync("Save occurred");
}
}
这是因为默认情况下
button
表单中的asubmits
以及表单的提交操作是Save
。<button type='button'>
应该停止那样。