【3】Blazor链接数据库
一、引入Nuget包Microsoft.EntityFrameworkCore
Microsoft.EntityFrameworkCore.SqlServer
Microsoft.EntityFrameworkCore.Tools
二、添加链接字符串
在文件appsetting.Json中添加ConnectionStrings配置信息
{
"Logging": {
"LogLevel": {
"Default": "Information",
"Microsoft.AspNetCore": "Warning"
}
},
"ConnectionStrings": {
"DefaultConnection": "Server=(localdb)\\mssqllocaldb;Database=MyDatabase;Trusted_Connection=True;"
},
"AllowedHosts": "*"
}
三、创建DbContext
添加UserInfo的Model类
public class UseInfo
{
public int Id {get; set; }
public string Name { get; set; }
public int Age {get; set; }
}
添加TrendSimulationDbContext 数据库上下文类
public class TrendSimulationDbContext : DbContext
{
public TrendSimulationDbContext(DbContextOptions<TrendSimulationDbContext> options) : base(options)
{
}
protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder)
{
}
public DbSet<UseInfo> UserInfos { get; set; }
}
四、注入SqlServer数据库
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Web;
using Microsoft.EntityFrameworkCore;
using TrendSimulation;
using TrendSimulation.Data;
var builder = WebApplication.CreateBuilder(args);
//查找配置信息
IConfiguration configuration = new ConfigurationBuilder().SetBasePath(Environment.CurrentDirectory).AddJsonFile("appsettings.json").Build();
builder.Services.AddRazorPages();
builder.Services.AddServerSideBlazor();
builder.Services.AddSingleton<WeatherForecastService>();
//注入数据库，通过configuration 获取连接字符串配置信息
builder.Services.AddDbContext<TrendSimulationDbContext>(options => options.UseSqlServer(configuration.GetConnectionString("DefaultConnection")));
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Error");
}
app.UseStaticFiles();
app.UseRouting();
app.MapBlazorHub();
app.MapFallbackToPage("/_Host");
app.Run();
五、实验数据库迁移
打开控制台
https://i-blog.csdnimg.cn/direct/e519dce639b14999b3ffd6da82e5383e.png
实验迁移命令
Add-Migration Init
Update-database
六、创建用户信息页面
接口
public interface IUserInfoService
{
public void Add(UseInfo useInfo);
public void Update(UseInfo useInfo);
public void Delete(UseInfo useInfo);
public Task<UseInfo> Get(string name);
public Task<List<UseInfo>> First();
}
实现用户信息的CRUD
public class UserInfoSerivce : IUserInfoService
{
public TrendSimulationDbContext _DbContext;
public UserInfoSerivce(TrendSimulationDbContext Context)
{
_DbContext = Context;
}
public void Add(UseInfo useInfo)
{
_DbContext.Add(useInfo);
_DbContext.SaveChanges();
}
public void Delete(UseInfo useInfo)
{
_DbContext.Add(useInfo);
_DbContext.SaveChanges();
}
public async Task<UseInfo> Get(string name)
{
return await _DbContext.UserInfos.FirstOrDefaultAsync(x => x.Name == "张三");
}
public async Task<List<UseInfo>> First()
{
return await _DbContext.UserInfos.ToListAsync();
}
public void Update(UseInfo useInfo)
{
_DbContext.Add(useInfo);
_DbContext.SaveChanges();
}
}
在Program中注入服务
builder.Services.AddScoped<IUserInfoService,UserInfoSerivce>();
创建Razor页面
https://i-blog.csdnimg.cn/direct/37d01b57f53c40f2a3e27ff11be33b2d.png
User.razor
@page "/user"
@{
}
//依赖注入UserInfoSerivce服务
@inject IUserInfoService UserInfoSerivce
@using TrendSimulation.Interface
@using TrendSimulation.Service
@using TrendSimulation.Model
<div>
<label for="userInput">Enter something:</label>
//绑定属性
<input id="userName" @bind="userName" />
<input id="userAge" @bind="userAge" />
</div>
<div>
<button @onclick="Submit">Submit</button>
</div>
@if (useInfo == null)
{
<p><em>Loading...</em></p>
}
else
{
<table class="table">
<thead>
<tr>
<th>NAME</th>
<th>AGE</th>
</tr>
</thead>
<tbody>
//打印插入的用户数据
@foreach (var forecast in useInfo)
{
<tr>
<td>@forecast.Name</td>
<td>@forecast.Age</td>
</tr>
}
</tbody>
</table>
}
@code {
private string userName = string.Empty;
private int userAge ;
private List<UseInfo> useInfo;
private async void Submit()
{
UserInfoSerivce.Add(new UseInfo { Age = userAge, Name = userName });
}
//初始化，查询用户列表
protected override async Task OnInitializedAsync()
{
useInfo = (await UserInfoSerivce.First()) is null ? new List<UseInfo>() : (await UserInfoSerivce.First());
}
}
七、结果展示
https://i-blog.csdnimg.cn/direct/a4a6ca168d2a4abeadabb5db1aa34961.png
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]