使用Blazor从API检索数据。数据未提取

时间:2019-05-30 02:46:20

标签: api asp.net-core crud blazor

使用ASP.net Core 3.0和Blazor。我正在修改在这里找到的项目:https://ankitsharmablogs.com/asp-net-core-crud-using-blazor-and-entity-framework-core/

我使用Scofold-DbContext构建了Context文件和Model类。 VS与数据库联系以创建所需文件没有问题。

剃刀视图:

@using ShopLive1.Shared.Models
@page "/fetchemployees"
@inject  HttpClient Http

<h1>Shop Live - Repair Order Update</h1>

@if(roList == null)
{
    <p><em>Loading....</em></p>
}
else
{
    <table class="table">
        <thead>
            <tr>
                <th>Control Number</th>
                <th>VIN</th>
                <th>Make</th>
                <th>Model</th>
                <th>Customer</th>
                <th>Repair Stage</th>
                <th>Location</th>
                <th>Assigned</th>
            </tr>
        </thead>
        <tbody>
            @foreach(var ro in roList)
            {
                <tr>
                    <td>@ro.ControlNumber</td>
                    <td>@ro.Vin</td>
                    <td>@ro.Make</td>
                    <td>@ro.Model</td>
                    <td>@ro.Customer</td>
                    <td>@ro.Stage</td>
                    <td>@ro.VehicleLocation</td>
                    <td>@ro.Technician</td>
                </tr>
            }
        </tbody>
    </table>
}


@functions{
    RepairOrder[] roList;

    protected override async Task OnInitAsync()
    {
        roList = await Http.GetJsonAsync<RepairOrder[]>("api/RepairOrder/Index");
    }
}

数据访问层类:

ShopLiveContext db = new ShopLiveContext();

        //To get all repair orders
        public List<RepairOrder> GetAllRepairOrders()
        {
            try
            {
                return db.RepairOrder.ToList();
            }
            catch
            {
                throw;
            }

        }

        //To add new Repair Orders
        public void AddRepairOrder(RepairOrder ro)
        {
            try
            {
                db.RepairOrder.Add(ro);
                db.SaveChanges();
            }
            catch
            {
                throw;
            }
        }

        //To update Repair Orders
        public void UpdateRepairOrder(RepairOrder ro)
        {
            try
            {
                db.Entry(ro).State = EntityState.Modified;
                db.SaveChanges();
            }
            catch
            {
                throw;
            }
        }

        //Get the details of a particular RO
        public RepairOrder GetRepairOrderDetails(int id)
        {
            try
            {
                RepairOrder ro = db.RepairOrder.Find(id);
                return ro;
            }
            catch
            {
                throw;
            }
        }

        //To delete a record
        public void DeleteRepairOrder(int id)
        {
            try
            {
                RepairOrder ro = db.RepairOrder.Find(id);
                db.RepairOrder.Remove(ro);
                db.SaveChanges();
            }
            catch
            {
                throw;
            }
        }
    }
}

数据上下文文件:

public ShopLiveContext()
        {
        }

        public ShopLiveContext(DbContextOptions<ShopLiveContext> options)
            : base(options)
        {
        }

        public virtual DbSet<RepairOrder> RepairOrder { get; set; }

        protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder)
        {
            if (!optionsBuilder.IsConfigured)
            {
                optionsBuilder.UseSqlServer("Data Source=sumcso-8g5lr52;Initial Catalog=ShopLive;Integrated Security=True");
            }
        }

        protected override void OnModelCreating(ModelBuilder modelBuilder)
        {
            modelBuilder.HasAnnotation("ProductVersion", "3.0.0-preview5.19227.1");

            modelBuilder.Entity<RepairOrder>(entity =>
            {
                entity.Property(e => e.ControlNumber)
                    .IsRequired()
                    .HasMaxLength(13)
                    .IsUnicode(false);

                entity.Property(e => e.Customer)
                    .IsRequired()
                    .HasMaxLength(50)
                    .IsUnicode(false);

                entity.Property(e => e.Make)
                    .HasMaxLength(50)
                    .IsUnicode(false);

                entity.Property(e => e.ManagerNote)
                    .HasMaxLength(5000)
                    .IsUnicode(false);

                entity.Property(e => e.Model)
                    .HasMaxLength(50)
                    .IsUnicode(false);

                entity.Property(e => e.Stage)
                    .IsRequired()
                    .HasMaxLength(50)
                    .IsUnicode(false);

                entity.Property(e => e.TechncicianNote)
                    .HasMaxLength(5000)
                    .IsUnicode(false);

                entity.Property(e => e.Technician)
                    .HasMaxLength(50)
                    .IsUnicode(false);

                entity.Property(e => e.VehicleLocation)
                    .IsRequired()
                    .HasMaxLength(50)
                    .IsUnicode(false);

                entity.Property(e => e.Vin)
                    .HasColumnName("VIN")
                    .HasMaxLength(20)
                    .IsUnicode(false);
            });
        }
    }

当我运行项目时,单击指向新页面的链接,它显示为“正在加载...”,但从不从数据库中获取数据并加载表。

有人可以向我指出我可能缺少的东西吗?

2 个答案:

答案 0 :(得分:1)

我想这是因为您的网址错误。您使用

“ api / RepairOrder / Index”而不是“ api / Employee / Index”

此应用可能还有其他问题,但这是我第一个弱视的人。

注意:

  • 此应用程序很古老。几乎是史前史。它甚至在我听说Blazor之前就已经编好了。

  • 您应该使用邮递员或Fiddler之类的工具来验证Web API是否返回数据。这样可以为您省去很多麻烦。

  • 我建议您不要遵循此人撰写的文章和书籍来学习Blazor。他本人需要在Blazor上学习很多课程,以及互联网的工作原理。他也从未认真超越CRUD。您提供的文章链接包含对Web,SPA和Blazor本身的错误和基本理解。

改为学习:

  1. Blazor文档
  2. 我已经开始学习Blazor,建议您使用
  3. https://github.com/dotnet-presentations/blazor-workshop
  4. https://github.com/aspnet/samples/tree/master/samples/aspnetcore/blazor

希望这对您有帮助...

答案 1 :(得分:-1)

到目前为止,您只知道OnInitAsync()内部出现问题。

Blazor确实还不能很好地通知您有关错误。

首先查看开发工具(F12)控制台日志。
另外,在Http调用周围进行try / catch。您可以在那里写控制台。

相关问题