Maui Blazor 集成 Sqlite

ow.z

已于 2023-10-29 13:41:57 修改

阅读量283

点赞数 1

分类专栏： Maui 文章标签： sqlite wpf c#

于 2023-10-29 13:41:22 首次发布

本文链接：https://blog.csdn.net/weixin_45876789/article/details/134102300

版权

Maui 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

一、安装Sqlite

NuGet，浏览，搜索并安装 sqlite-net-pcl

sqlite-net-pcl

在这里插入图片描述

二、添加Models

指定主键，自增

PoetryModel.cs

using SQLite;

namespace MauiApp1.Models;

public class PoetryModel
{
    [PrimaryKey, AutoIncrement]
    public int Id { get; set; }
    public string Name { get; set; }
    public string Content { get; set; }

}

三、添加Services

添加接口

IPoetryStorage.cs

using MauiApp1.Models;

namespace MauiApp1.Services;

public interface IPoetryStorage
{
    Task InitializeAsync();

    Task SavePoetryAsync(PoetryModel poetry);

    Task DeletePoetryAsync(int id);

    Task<PoetryModel> GetPoetryAsync(int id);

    Task<IEnumerable<PoetryModel>> SearchByName(string name);
}

实现CRUD

PoetryStorage.cs

using MauiApp1.Models;
using SQLite;

namespace MauiApp1.Services;

public class PoetryStorage : IPoetryStorage
{
    /// <summary>
    /// 数据库定义
    /// </summary>
    public const string DbName = "poetrydb.sqlite";
    public static readonly string PoetryDbPath =
        Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), DbName);

    /// <summary>
    /// 数据库连接
    /// </summary>
    private SQLiteAsyncConnection _connection;
    private SQLiteAsyncConnection Connection =>
        _connection ??= new SQLiteAsyncConnection(PoetryDbPath);

    /// <summary>
    /// 创建数据库表
    /// </summary>
    public async Task InitializeAsync() =>
        await Connection.CreateTableAsync<PoetryModel>();

    /// <summary>
    /// 保存一条数据
    /// </summary>
    /// <param name="poetry"></param>
    /// <returns></returns>
    /// <exception cref="NotImplementedException"></exception>
    public async Task SavePoetryAsync(PoetryModel poetry) =>
        await Connection.InsertAsync(poetry);

    /// <summary>
    /// 删除一条记录
    /// </summary>
    /// <param name="id"></param>
    /// <returns></returns>
    public async Task DeletePoetryAsync(int id) =>
        //await Connection.Table<Poetry>().Where(p => p.Id == id).FirstOrDefaultAsync();
        await Connection.Table<PoetryModel>().DeleteAsync(p => p.Id == id);

    /// <summary>
    /// 获取一条记录
    /// </summary>
    /// <param name="id"></param>
    /// <returns></returns>
    public async Task<PoetryModel> GetPoetryAsync(int id) =>
        //await Connection.Table<PoetryModel>().Where(p => p.Id == id).FirstOrDefaultAsync();
        await Connection.Table<PoetryModel>().FirstOrDefaultAsync(p => p.Id == id);

    /// <summary>
    /// 获取一些数据
    /// </summary>
    /// <param name="name"></param>
    /// <returns></returns>
    public async Task<IEnumerable<PoetryModel>> SearchByName(string name) =>
        await Connection.Table<PoetryModel>().Where(p => p.Name.Contains(name)).ToListAsync();
}

四、添加页面

添加页面、按钮

Poetry.razor

@page "/poetry"
@using MauiApp1.Services
@inject IPoetryStorage PoetryStorage

<h3>Poetry</h3>

<Button Icon="fas fa-database" OnClick="InitializeAsync">初始化数据库</Button>

<BootstrapInputGroup>
    <BootstrapInputGroupLabel DisplayText="标题" />
    <BootstrapInput @bind-Value="_name" />
</BootstrapInputGroup>

<BootstrapInputGroup>
    <BootstrapInputGroupLabel DisplayText="内容" />
    <BootstrapInput @bind-Value="_content" />
</BootstrapInputGroup>

<Button OnClick="SaveAsync">新增</Button>


<BootstrapInputGroup>
    <BootstrapInputGroupLabel DisplayText="标题" />
    <BootstrapInput @bind-Value="_query"></BootstrapInput>
</BootstrapInputGroup>

<Button OnClick="SearchAsync">搜索</Button>

@foreach (var poetry in _poetries)
{
    <Card>
        <BodyTemplate>
            <div>@poetry.Name</div>
            <div>@poetry.Content</div>
        </BodyTemplate>
    </Card>
}

<BootstrapInputGroup>
    <BootstrapInputGroupLabel DisplayText="id"/>
    <BootstrapInput @bind-Value="_id"/>
</BootstrapInputGroup>

<Button OnClick="GetAsync">查询</Button>

<table>
    <thead>
    <tr>
        <th>标题</th>
        <th>内容</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>@_itemName</td>
        <td>@_itemContent</td>
    </tr>
    </tbody>
</table>

<Button OnClick="DeleteAsync">删除</Button>

调用方法

Poetry.razor.cs

using MauiApp1.Models;
using SQLite;

namespace MauiApp1.Services;

public class PoetryStorage : IPoetryStorage
{
    /// <summary>
    /// 数据库定义
    /// </summary>
    public const string DbName = "poetrydb.sqlite";
    public static readonly string PoetryDbPath =
        Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData), DbName);

    /// <summary>
    /// 数据库连接
    /// </summary>
    private SQLiteAsyncConnection _connection;
    private SQLiteAsyncConnection Connection =>
        _connection ??= new SQLiteAsyncConnection(PoetryDbPath);

    /// <summary>
    /// 创建数据库表
    /// </summary>
    public async Task InitializeAsync() =>
        await Connection.CreateTableAsync<PoetryModel>();

    /// <summary>
    /// 保存一条数据
    /// </summary>
    /// <param name="poetry"></param>
    /// <returns></returns>
    /// <exception cref="NotImplementedException"></exception>
    public async Task SavePoetryAsync(PoetryModel poetry) =>
        await Connection.InsertAsync(poetry);

    /// <summary>
    /// 删除一条记录
    /// </summary>
    /// <param name="id"></param>
    /// <returns></returns>
    public async Task DeletePoetryAsync(int id) =>
        //await Connection.Table<Poetry>().Where(p => p.Id == id).FirstOrDefaultAsync();
        await Connection.Table<PoetryModel>().DeleteAsync(p => p.Id == id);

    /// <summary>
    /// 获取一条记录
    /// </summary>
    /// <param name="id"></param>
    /// <returns></returns>
    public async Task<PoetryModel> GetPoetryAsync(int id) =>
        //await Connection.Table<PoetryModel>().Where(p => p.Id == id).FirstOrDefaultAsync();
        await Connection.Table<PoetryModel>().FirstOrDefaultAsync(p => p.Id == id);

    /// <summary>
    /// 获取一些数据
    /// </summary>
    /// <param name="name"></param>
    /// <returns></returns>
    public async Task<IEnumerable<PoetryModel>> SearchByName(string name) =>
        await Connection.Table<PoetryModel>().Where(p => p.Name.Contains(name)).ToListAsync();
}

添加导航标签，页面入口

NavMenu.razor

<div class="top-row ps-3 navbar navbar-dark">
    <div class="container-fluid">
        <a class="navbar-brand" href="">MauiApp1</a>
        <button title="Navigation menu" class="navbar-toggler" @οnclick="ToggleNavMenu">
            <span class="navbar-toggler-icon"></span>
        </button>
    </div>
</div>

<div class="@NavMenuCssClass" @οnclick="ToggleNavMenu">
    <nav class="flex-column">
        <div class="nav-item px-3">
            <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
                <span class="oi oi-home" aria-hidden="true"></span> Home
            </NavLink>
        </div>
        <div class="nav-item px-3">
            <NavLink class="nav-link" href="counter">
                <span class="oi oi-plus" aria-hidden="true"></span> Counter
            </NavLink>
        </div>
        <div class="nav-item px-3">
            <NavLink class="nav-link" href="fetchdata">
                <span class="oi oi-list-rich" aria-hidden="true"></span> Fetch data
            </NavLink>
        </div>
        <div class="nav-item px-3">
            <NavLink class="nav-link" href="poetry">
                <span class="oi oi-list-rich" aria-hidden="true"></span> Database
            </NavLink>
        </div>
    </nav>
</div>

@code {
    private bool collapseNavMenu = true;

    private string NavMenuCssClass => collapseNavMenu ? "collapse" : null;

    private void ToggleNavMenu()
    {
        collapseNavMenu = !collapseNavMenu;
    }
}

五、依赖注入

依赖注入

MauiProgram.cs

using MauiApp1.Data;
using MauiApp1.Services;
using Microsoft.Extensions.Logging;

namespace MauiApp1
{
    public static class MauiProgram
    {
        public static MauiApp CreateMauiApp()
        {
            var builder = MauiApp.CreateBuilder();
            builder
                .UseMauiApp<App>()
                .ConfigureFonts(fonts =>
                {
                    fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
                });

            builder.Services.AddMauiBlazorWebView();

            // BootstrapBlazor
            builder.Services.AddBootstrapBlazor();

            #if DEBUG
                builder.Services.AddBlazorWebViewDeveloperTools();
		        builder.Logging.AddDebug();
            #endif

            // 单实例模式，所有操作返回相同实例
            builder.Services.AddSingleton<WeatherForecastService>();

            // 单链接模式，每次操作返回相同实例
            builder.Services.AddScoped<IPoetryStorage, PoetryStorage>();

            // 多实例模式，每次操作返回新的实例
            //builder.Services.AddTransient<IPoetryStorage, PoetryStorage>();

            return builder.Build();
        }
    }
}