C# 在Blazor服务器端应用程序中首次调用Web API不起作用

当我启动ASP.Net Core Blazor服务器端应用程序时，第一次单击“保存”按钮时，什么也没发生。发送到控制器/API的post将触发，但我的控制器/API中的PostListing函数从未被调用。但是，如果我再次单击“保存”按钮，它将按预期工作。发生什么事？谢谢所有能帮忙的人

这是我的页面：

@page "/fetchdata"
@using SellEverywhere.Data
@using SellEverywhere.Models
@using System.Net.Http.Json
@inject HttpClient Http


<h1>Your Listings</h1>

<table width="100%" style="background:#05163D;color:honeydew">
    <tr>
        <td width="20"> </td>
        <td>
            <h2> Add New Listing Details</h2>
        </td>
        <td> </td>
        <td align="right">
            <button class="btn btn-info" @onclick="AddNewListing">Add New Listing</button>
        </td>
        <td width="10"> </td>
    </tr>
    <tr>
        <td colspan="2"></td>
    </tr>
</table>
<hr />
<form>
    <table class="form-group">
        <tr>
            <td>
                <label for="Name" class="control-label">ID</label>
            </td>
            <td>
                <input type="text" class="form-control" @bind="@lsts.Id" readonly />
            </td>
            <td width="20"> </td>
        </tr>
        <tr>
            <td>
                <label for="Name" class="control-label">Title</label>
            </td>
            <td>
                <input type="text" class="form-control" @bind="@lsts.Title" />
            </td>
            <td width="20"> </td>
            <td>
                <label for="Description" class="control-label">Description</label>
            </td>
            <td>
                <input type="text" class="form-control" @bind="@lsts.Description" />
            </td>
            <td width="20"> </td>
            <td>
                <label for="Name" class="control-label">Brand</label>
            </td>
            <td>
                <input type="text" class="form-control" @bind="@lsts.Brand" />
            </td>
        </tr>
        <tr>
            <td>
                <label for="Name" class="control-label">Size</label>
            </td>
            <td>
                <input type="text" class="form-control" @bind="@lsts.Size" />
            </td>
            <td width="20"> </td>
            <td>
                <label for="Name" class="control-label">Color</label>
            </td>
            <td>
                <input type="text" class="form-control" @bind="@lsts.Color" />
            </td>
            <td width="20"> </td>
            <td>
                <label for="Name" class="control-label">Condition</label>
            </td>
            <td>
                <input type="text" class="form-control" @bind="@lsts.Condition" />
            </td>
            <td width="20"> </td>
            <td></td>
            <td>
                <button type="submit" class="btn btn-success" @onclick="(async () => await AddListing())" style="width:220px;">Save</button>
            </td>
        </tr>
    </table>
</form>

<table width="100%" style="background:#0A2464;color:honeydew">
    <tr>
        <td width="20"> </td>
        <td>
            <h2>Listing Details</h2>
        </td>

    </tr>
    <tr>
        <td colspan="2"></td>
    </tr>
</table>

@if (listing == null)
{
    <p><em>No listing found...</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>Id</th>
                <th>Title</th>
                <th>Brand</th>
                <th>Color</th>
                <th>Condition</th>
                <th>Size</th>
                <th>Description</th>
                <th>Tag1</th>
                <th>Tag2</th>
                <th>Tag3</th>
                <th>Price</th>
                <th>Lowest Price</th>
                <th>Shipping Price</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var lst in listing)
            {
            <tr>
                <td>@lst.Id</td>
                <td>@lst.Title</td>
                <td>@lst.Brand</td>
                <td>@lst.Color</td>
                <td>@lst.Condition</td>
                <td>@lst.Size</td>
                <td>@lst.Description</td>
                <td>@lst.Tag1</td>
                <td>@lst.Tag2</td>
                <td>@lst.Tag3</td>
                <td>@lst.Price</td>
                <td>@lst.LowestPrice</td>
                <td>@lst.ShippingPrice</td>
                <td><button class="btn btn-primary" @onclick="@(async () => await EditListing(@lst.Id))" style="width:110px;">Edit</button></td>
                <td><button class="btn btn-danger" @onclick="@(async () => await DeleteListing(@lst.Id))">Delete</button></td>
            </tr>

            }
        </tbody>
    </table>
}

@code {
    Listing[] listing;
    Listing lsts = new Listing();
    string ids = "0";
    //bool showAddrow = false;
    protected override async Task OnInitializedAsync()
    {
        listing = await Http.GetFromJsonAsync<Listing[]>("https://localhost:44324/api/Listings/");
    }

    void AddNewListing()
    {
        lsts = new Listing();
    }
    // Add New Listings Details Method
    protected async Task AddListing()
    {
        if (lsts.Id == 0)

        {
            await Http.PostAsJsonAsync("https://localhost:44324/api/Listings/", lsts);
        }
        else
        {
            await Http.PutAsJsonAsync("https://localhost:44324/api/Listings/" + lsts.Id, lsts);
        }
        lsts = new Listing();
        listing = await Http.GetFromJsonAsync<Listing[]>("https://localhost:44324/api/Listings/");
    }
    // Edit Method
    protected async Task EditListing(int listingID)
    {
        ids = listingID.ToString();
        lsts = await Http.GetFromJsonAsync<Listing>("https://localhost:44324/api/Listings/" + Convert.ToInt32(listingID));
    }
    // Delete Method
    protected async Task DeleteListing(int listingID)
    {
        ids = listingID.ToString();
        await Http.DeleteAsync("https://localhost:44324/api/Listings/" + Convert.ToInt32(listingID));
        listing = await Http.GetFromJsonAsync<Listing[]>("https://localhost:44324/api/Listings/");
    }

}

@page”/fetchdata
@使用SellEverywhere.Data
@到处使用模型
@使用System.Net.Http.Json
@注入HttpClient Http
你的物品
添加新的列表详细信息
添加新列表

身份证件
标题
描述
烙印
大小
颜色
条件
拯救
上市详情
@if（清单==null）
{
找不到列表

}
其他的
{
身份证件
标题
烙印
颜色
条件
大小
描述
Tag1
Tag2
Tag3
价格
最低价格
运费
@foreach（清单中的var lst）
{
@第一身份证
@第一标题
@第一品牌
@一级颜色
@一级条件
@一级尺寸
@一、说明
@lst.Tag1
@lst.Tag2
@lst.Tag3
@一级价格
@洛伊斯特莱斯酒店
@船价
编辑
删除
}
}
@代码{
上市[]上市；
清单lsts=新清单（）；
字符串id=“0”；
//bool showAddrow=false；
受保护的重写异步任务OnInitializedAsync（）
{
清单=等待Http.GetFromJsonAsync（“https://localhost:44324/api/Listings/");
}
void AddNewListing（）
{
lsts=新列表（）；
}
//添加新列表详细信息方法
受保护的异步任务AddListing（）
{
如果（lsts.Id==0）
{
等待Http.PostAsJsonAsync（“https://localhost:44324/api/Listings/“，LST）；
}
其他的
{
等待Http.PutAsJsonAsync（“https://localhost:44324/api/Listings/“+lsts.Id，lsts）；
}
lsts=新列表（）；
清单=等待Http.GetFromJsonAsync（“https://localhost:44324/api/Listings/");
}
//编辑方法
受保护的异步任务EditListing（int listingID）
{
ids=listingID.ToString（）；
lsts=wait Http.GetFromJsonAsync（“https://localhost:44324/api/Listings/“+转换为32（列表ID））；
}
//删除方法
受保护的异步任务DeleteListing（int listingID）
{
ids=listingID.ToString（）；
等待Http.DeleteAsync（“https://localhost:44324/api/Listings/“+转换为32（列表ID））；
清单=等待Http.GetFromJsonAsync（“https://localhost:44324/api/Listings/");
}
}

这是我的控制器/API：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Security.Claims;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.EntityFrameworkCore;
using SellEverywhere.Data;
using SellEverywhere.Models;

namespace SellEverywhere.Controllers
{   [Produces("application/json")]
    [Route("api/[controller]")]
    [ApiController]
    public class ListingsController : ControllerBase
    {
        private readonly ApplicationDbContext _context;

        public ListingsController(ApplicationDbContext context)
        {
            _context = context;
        }

        // GET: api/Listings
        [HttpGet]
        public async Task<ActionResult<IEnumerable<Listing>>> GetListing()
        {
            return await _context.Listing.ToListAsync();
        }

        // GET: api/Listings/5
        [HttpGet("{id}")]
        public async Task<ActionResult<Listing>> GetListing(int id)
        {
            var listing = await _context.Listing.FindAsync(id);

            if (listing == null)
            {
                return NotFound();
            }

            return listing;
        }

        // PUT: api/Listings/5
        // To protect from overposting attacks, enable the specific properties you want to bind to, for
        // more details, see https://go.microsoft.com/fwlink/?linkid=2123754.
        [HttpPut("{id}")]
        public async Task<IActionResult> PutListing(int id, Listing listing)
        {
            if (id != listing.Id)
            {
                return BadRequest();
            }

            _context.Entry(listing).State = EntityState.Modified;

            try
            {
                await _context.SaveChangesAsync();
            }
            catch (DbUpdateConcurrencyException)
            {
                if (!ListingExists(id))
                {
                    return NotFound();
                }
                else
                {
                    throw;
                }
            }

            return NoContent();
        }

        // POST: api/Listings
        // To protect from overposting attacks, enable the specific properties you want to bind to, for
        // more details, see https://go.microsoft.com/fwlink/?linkid=2123754.
        [HttpPost]
        public async Task<ActionResult<Listing>> PostListing(Listing listing)
        {
            listing.UserId = User.FindFirstValue(ClaimTypes.NameIdentifier);
            _context.Listing.Add(listing);
            await _context.SaveChangesAsync();

            return CreatedAtAction("GetListing", new { id = listing.Id }, listing);
        }

        // DELETE: api/Listings/5
        [HttpDelete("{id}")]
        public async Task<ActionResult<Listing>> DeleteListing(int id)
        {
            var listing = await _context.Listing.FindAsync(id);
            if (listing == null)
            {
                return NotFound();
            }

            _context.Listing.Remove(listing);
            await _context.SaveChangesAsync();

            return listing;
        }

        private bool ListingExists(int id)
        {
            return _context.Listing.Any(e => e.Id == id);
        }
    }
}

使用系统；
使用System.Collections.Generic；
使用System.Linq；
使用System.Security.Claims；
使用System.Threading.Tasks；
使用Microsoft.AspNetCore.Mvc；
使用Microsoft.EntityFrameworkCore；
使用数据；
到处使用模型；
命名空间。控制器
{[products（“application/json”）]
[路由（“api/[控制器]”）]
[ApiController]
公共类ListingsController:ControllerBase
{
私有只读应用程序的bContext\u上下文；
公共ListingsController（ApplicationDbContext上下文）
{
_上下文=上下文；
}
//获取：api/列表
[HttpGet]
公共异步任务GetListing（）
{
return wait_context.Listing.tolistSync（）；
}
//获取：api/Listings/5
[HttpGet（“{id}”）]
公共异步任务GetListing（int id）
{
var listing=wait_context.listing.FindAsync（id）；
if（清单==null）
{
返回NotFound（）；
}
返回列表；
}
//PUT:api/Listings/5
//若要防止套印攻击，请启用要绑定到的特定属性，例如
//更多详细信息，请参阅https://go.microsoft.com/fwlink/?linkid=2123754.
[HttpPut（“{id}”）]
公共异步任务列表（int-id，列表）
{
if（id！=listing.id）
{
返回请求（）；
}
_context.Entry（listing.State=EntityState.Modified；
尝试
{
wait_context.SaveChangesAsync（）；
}
catch（DbUpdateConcurrencyException）
{
如果（！ListingExists（id））
{
返回NotFound（）；
}
其他的
{
投掷；
}
}
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.ComponentModel.DataAnnotations.Schema;


namespace SellEverywhere.Models
{
    public class Listing
    {
        [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
        [Key]
        public int Id { get; set; }
        public string UserId { get; set; }
        public string Title { get; set; }
        public string Description { get; set; }
        public string Color { get; set; }
        public string Condition { get; set; }
        public string Brand { get; set; }
        public string Type { get; set; }
        public string Size { get; set; }
        public string Tag1 { get; set; }
        public string Tag2 { get; set; }
        public string Tag3 { get; set; }
        public int Price { get; set; }
        public int LowestPrice { get; set; }
        public int ShippingPrice { get; set; }
        public ICollection<Photos> Photos { get; set; }
    }
    public class Photos
    {
        [DatabaseGenerated(DatabaseGeneratedOption.Identity)]
        [Key]
        public int Id { get; set; }
        //[ForeignKey("Listing")]
        public int ListingId { get; set; }
        public byte[] Image { get; set; }
        public virtual Listing Listing { get; set; }
    }
}