基于 abp vNext 和 .NET Core 开发博客项目 - 使用 abp cli 搭建项目
基于 abp vNext 和 .NET Core 开发博客项目 - 给项目瘦身，让它跑起来
基于 abp vNext 和 .NET Core 开发博客项目 - 完善与美化，Swagger登场
基于 abp vNext 和 .NET Core 开发博客项目 - 数据访问和代码优先
基于 abp vNext 和 .NET Core 开发博客项目 - 自定义仓储之增删改查
基于 abp vNext 和 .NET Core 开发博客项目 - 统一规范API，包装返回模型
基于 abp vNext 和 .NET Core 开发博客项目 - 再说Swagger，分组、描述、小绿锁
基于 abp vNext 和 .NET Core 开发博客项目 - 接入GitHub，用JWT保护你的API
基于 abp vNext 和 .NET Core 开发博客项目 - 异常处理和日志记录
基于 abp vNext 和 .NET Core 开发博客项目 - 使用Redis缓存数据
基于 abp vNext 和 .NET Core 开发博客项目 - 集成Hangfire实现定时任务处理
基于 abp vNext 和 .NET Core 开发博客项目 - 用AutoMapper搞定对象映射
基于 abp vNext 和 .NET Core 开发博客项目 - 定时任务最佳实战（一）
基于 abp vNext 和 .NET Core 开发博客项目 - 定时任务最佳实战（二）
基于 abp vNext 和 .NET Core 开发博客项目 - 定时任务最佳实战（三）
基于 abp vNext 和 .NET Core 开发博客项目 - 博客接口实战篇（一）
基于 abp vNext 和 .NET Core 开发博客项目 - 博客接口实战篇（二）
基于 abp vNext 和 .NET Core 开发博客项目 - 博客接口实战篇（三）
基于 abp vNext 和 .NET Core 开发博客项目 - 博客接口实战篇（四）
基于 abp vNext 和 .NET Core 开发博客项目 - 博客接口实战篇（五）
基于 abp vNext 和 .NET Core 开发博客项目 - Blazor 实战系列（一）
基于 abp vNext 和 .NET Core 开发博客项目 - Blazor 实战系列（二）
上一篇完成了博客的主题切换，菜单和二维码的显示与隐藏功能，本篇继续完成分页查询文章列表的数据展示。
添加页面现在点击页面上的链接，都会提示错误消息，因为没有找到对应的路由地址。先在Pages下创建五个文件夹：Posts、Categories、Tags、Apps、FriendLinks。
然后在对应的文件夹下添加Razor组件。
Posts文件夹：文章列表页面Posts.razor、根据分类查询文章列表页面Posts.Category.razor、根据标签查询文章列表页面Posts.Tag.razor、文章详情页Post.razor
Categories文件夹：分类列表页面Categories.razor
Tags文件夹：标签列表页面Tags.razor
Apps文件夹：Apps.razor准备将友情链接入口放在里面
FriendLinks文件夹：友情链接列表页面FriendLinks.razor
先分别创建上面这些Razor组件，差不多除了后台CURD的页面就这些了，现在来逐个突破。
不管三七二十一，先把所有页面的路由给确定了，指定页面路由使用 @page 指令，官方文档说不支持可选参数，但是可以支持多个路由规则。
默认先什么都不显示，可以将之前的加载中圈圈写成一个组件，供每个页面使用。
在Shared文件夹添加组件Loading.razor。
<!--Loading.razor--> <div></div> //Posts.razor @page "/posts/" @page "/posts/page/{page:int}" @page "/posts/{page:int}" <Loading /> @code { /// <summary> /// 当前页码 /// </summary> [Parameter] public int? page { get; set; } }这里我加了三条，可以匹配没有page参数，带page参数的，/posts/page/{page:int}这个大家可以不用加，我是用来兼容目前线上的博客路由的。总的来说可以匹配到：/posts、/posts/1、/posts/page/1这样的路由。
//Posts.Category.razor @page "/category/{name}" <Loading /> @code { /// <summary> /// 分类名称参数 /// </summary> [Parameter] public string name { get; set; } }根据分类名称查询文章列表页面，name当作分类名称参数，可以匹配到类似于：/category/aaa、/category/bbb这样的路由。
//Posts.Tag.razor @page "/tag/{name}" <Loading /> @code { /// <summary> /// 标签名称参数 /// </summary> [Parameter] public string name { get; set; } }这个根据标签名称查询文章列表页面和上面差不多一样，可以匹配到：/tag/aaa、/tag/bbb这样的路由。
//Post.razor @page "/post/{year:int}/{month:int}/{day:int}/{name}" <Loading /> @code { [Parameter] public int year { get; set; } [Parameter] public int month { get; set; } [Parameter] public int day { get; set; } [Parameter] public string name { get; set; } }