草稿自动保存——填到一半再也不怕丢

📅 2026/7/3 5:00:01
草稿自动保存——填到一半再也不怕丢
一、一个属性开启草稿功能在AdminTable组件上加上EnableDrafttrueAdminTable TItemArticle TKeylong EnableDrafttrue DraftAutoSaveInterval30 !-- 表格列配置 -- /AdminTable属性类型默认值说明EnableDraftboolfalse是否启用草稿自动保存DraftAutoSaveIntervalint30草稿自动保存间隔秒就这么简单。一行额外代码都不用写。二、体验是什么样的场景1新增文章你打开「新增文章」弹窗填写标题、正文、分类……刚写到一半电脑死机了。重启后回到后台再次点击「新增文章」——弹窗会提示检测到未保存的草稿是否恢复点击确定之前填的内容全部回来了。场景2编辑文章你正在修改一篇长文改了十几处电话来了。你关掉浏览器去接电话。回来再次编辑这篇文章同样会提示你恢复草稿。新增和编辑的草稿是分开保存的不会互相覆盖。三、智能清理不打扰草稿不是无脑存有几个智能逻辑无变化不存如果表单数据和上次保存时一模一样不会重复存新增时没填任何内容不保存、不提示、不打扰编辑时没改动数据自动清理该条草稿提交成功后自动删除草稿体积控制草稿 JSON 会忽略导航属性只存外键避免超过 localStorage 限制你需要它的时候它在不需要它的时候它不碍事。四、背后的技术原理草稿数据存在浏览器的localStorage里不占用服务器资源。每30秒自动保存一次可自定义间隔恢复时从 localStorage 读取反序列化后回填表单每次保存/恢复都经过序列化处理支持复杂对象序列化优化AdminTable使用 Newtonsoft.Json 处理草稿序列化默认配置为private static readonly JsonSerializerSettings _draftJsonOptions new() { PreserveReferencesHandling PreserveReferencesHandling.Objects, ReferenceLoopHandling ReferenceLoopHandling.Ignore, NullValueHandling NullValueHandling.Ignore };为了控制 JSON 体积建议给实体类的导航属性加上[JsonIgnore]public class Article : EntityFull { public long? ClassifyId { get; set; } [JsonIgnore] // 草稿序列化时忽略导航属性只存外键 public Classify Classify { get; set; } public string Title { get; set; } }这样草稿里只有ClassifyId没有完整的Classify对象体积大幅减小。即使 Blazor Server 的 SignalR 连接断开草稿也安全地躺在本地。五、适用场景场景为什么需要草稿长表单文章、产品、订单填一次十几分钟丢了很崩溃网络不稳定环境公共WiFi、移动网络经常断临时走开电话、会议、下班……回来继续填复杂编辑需要反复修改、预览随时能保存凡是需要用户输入的地方草稿都有价值。六、与其他功能的联动配合代码生成器生成的页面天然支持草稿无需改造配合关联表外键下拉选中的值也会被草稿保存配合多语言多Tab表单每个Tab都能草稿保存草稿功能是AdminTable的内置能力所有基于AdminTable的页面自动获得。七、对比一下对比项传统开发EasyAdminBlazor手动实现草稿需要写localStorage读写、序列化、恢复逻辑至少200行代码一个属性区分新增/编辑要自己管理不同key自动区分智能清理自己判断何时删草稿自动处理你花一行配置的时间省下半天重复造轮子的精力。八、下一步草稿功能已经内置你只需要开启EnableDrafttrue。如果你还没试过今天就体验一下dotnet new install EasyAdminBlazor.Templates dotnet new easyadmin -n MyProject cd MyProject dotnet run