[52ABP系列] - 002、模板项目配合代码生成器开发

个人头像

前言

本篇的主要内容是 52ABP SPA模板如何配合52ABP代码生成器开发项目

如果不了解 52ABP 项目请先看我的第一篇文章 [52ABP系列] - 001、SPA免费项目模版搭建教程

话不多说,教程开始

一、安装代码生成器

首先打开VS,找到顶部菜单中的 工具 选项,打开 工具 选项中的 扩展和更新, 然后选择 联机 ,输入 52ABP 安装最新的代码生成器,支持生成UI的代码生成器版本是 2.1.8 或者更高版本 (我这里是2.1.8,本机打的包,暂时没有发布)

二、启动项目

请直接根据第一篇文章,搭建并运行项目: [52ABP系列] - 001、SPA免费项目模版搭建教程

三、新建实体并添加到数据库

在项目中的Core层创建一个实体对象 Member 如图所示

实体Member的代码贴在这里

using Abp.Domain.Entities;
using System;
using System.Collections.Generic;
using System.Text;

namespace LTMCompanyNameFree.YoyoCmsTemplate.Members
{
    public class Member : Entity<long>
    {
        public string Name { get; set; }

        public int Age { get; set; }

        public string Remark{ get; set; }
    }
}
创建数据表

DbContext 中添加 DbSet

迁移数据库,这里和第一篇文章中的创建数据库相同,但是命令会多一个,使用了了如下两个命令

add-migration AddEntityMember   // 创建迁移
update-database                 // 更新数据库

如果没有用过EFCore Code First做迁移,请先查阅资料 官方文档

四、使用代码生成器快速生成前后台基本代码

如果是第一次使用代码生成器请查看: .NET CORE 框架ABP的代码生成器(ABP Code Power Tools )使用说明文档

选中实体代码文件右键菜单选择52ABP代码生成器

选择你需要生成的选项,如果是第一次使用,就要勾选第一次是用代码生成器,会给你生成一些基础的代码。

NG-Zorro UI是生成前端页面的选项。

选择好了之后直接点击 确认 ,进入Dto配置界面,在这里勾选配置Dto要用到的字段、校验、字段对应的前端控件等等。 选择好了之后,直接点击确认,开始生成代码

生成成功将会弹框提示

生成的代码文件:

NgZorroUI目录中的members目录就是生成的前端页面,将这个目录copy到前端项目中使用的位置

Copy结束之后,打开生成的Readme.cs文件,根据说明一步步执行操作

  1. 编译并启动后端项目
  2. 运行前端项目中 nswag 目录下的 refresh.bat 文件
  3. refresh.bat 执行完成之后更新前端 shared-> service-proxies-> service-proxy.module.ts

  1. 添加到前端导航菜单

  1. 添加到前端路由

  1. 添加到前端对应的Module

按照步骤操作完成之后,编译启动前端项目查看效果

菜单

创建新数据

创建成功后的列表和操作

编辑

到这里本篇教程就结束了,配合代码生成器达到了快速开发的目的,当然代码生成器生成的代码还是有很大缺憾的,如果要灵活的话,还是需要你自己在代码生成器生成的代码基础上做修改。

文笔欠佳,只能尽力描述到细节,还请多多指正错误,多多支持