关于
低代码工具,支持 ChatGPT
详细文档
文档不经常更新,新功能使用方法可查看 releases
物料仓库
支持 ChatGPT

清晰动图点这里

清晰动图点这里
配置 ChatGPT

预置 Prompt 模板
使用 lowcode 原有代码片段功能,可以随意预置 Prompt,支持 EJS 模板语法,可快速创建分析代码、重构代码、代码添加注释等 Prompt。

配置 chatGPT 字段:

commandPrompt 既右键菜单选择模板后发送的内容,支持 EJS 模板语法。
viewPrompt 为 代码片段或者区块物料可视化详情页点 Ask ChatGPT 按钮后发送的内容。
lowcode 代码生成功能结合 ChatGPT
很好的解决了代码变量的命名难题。

清晰动图点这里
不用 ChatGPT ,也可以使用一些常用功能
快速创建组件

根据 yapi 接口文档生成请求方法
复制接口 id

写好接口方法,选中然后右键

生成的 ts 类型可能不完全正确,需要手动调整
根据 json 生成 api 请求方法
复制 json 数据,比如:
{
"code": 0,
"message": "成功",
"result": {
"records": [
{
"id": 137,
"code": "mechanisms",
"name": "外部机构",
"internalType": 0,
"needArea": 0,
"assetTypes": [],
"serviceLines": [
{
"serviceLineCode": "CESHI",
"serviceLineName": "测试勿动",
"status": 1
}
]
}
],
"total": 105,
"size": 10,
"current": 1,
"orders": [],
"optimizeCountSql": true,
"hitCount": false,
"countId": null,
"maxLimit": null,
"searchCount": true,
"pages": 11
}
}
写好接口方法,选中然后右键,选择相应的命令选项

需要手动调整参数,接口地址
根据 ts 类型生成 api 请求方法
复制 ts 类型,比如:
[{ name: string; code: string }]
写好接口方法,选中然后右键,选择相应的命令选项

根据 json 生成 ts 类型
复制 json 数据,比如:
{
"code": 0,
"message": "成功",
"result": {
"records": [
{
"id": 137,
"code": "mechanisms",
"name": "外部机构",
"internalType": 0,
"needArea": 0,
"assetTypes": [],
"serviceLines": [
{
"serviceLineCode": "CESHI",
"serviceLineName": "测试勿动",
"status": 1
}
]
}
],
"total": 105,
"size": 10,
"current": 1,
"orders": [],
"optimizeCountSql": true,
"hitCount": false,
"countId": null,
"maxLimit": null,
"searchCount": true,
"pages": 11
}
}
写好类型名称,选中然后右键,选择相应的命令选项

根据 json 替换字段类型

mock
下载 mock 项目

因为墙的原因下载不了的话,可以使用下面仓库地址下载:
https://gitee.com/lowcode-scaffold/lowcode-mock.git (不要直接 clone,用下图的方式)

routes 目录下创建新的 mock 文件

根据 yapi 接口文档生成 mock
复制接口 id


根据 ts 类型生成 mock
复制 ts 类型,比如(不需要复制类型名称):
{
/**
* 0:成功,其他:失败
*/
code: number;
message: string;
result: {
/**
* 当前页数
*/
current: number;
hitCount: boolean;
optimizeCountSql: boolean;
orders: string[];
/**
* 总页数
*/
pages: number;
/**
* 记录
*/
records: {
id: number;
/**
* 组织名称
*/
orgNodeName: string;
/**
* 组织编码
*/
orgNodeCode: string;
/**
* 组织名称全路径
*/
fullPath: string;
}[];
searchCount: boolean;
/**
* 每页展示数
*/
size: number;
/**
* 总数据条数
*/
total: number;
};
}

根据 json 生成 mock
同理,复制 json,选择对应的命令选项。
建议所有的前端项目共用同一个 mock 项目,避免频繁切换项目,以及接口冲突。不同的项目在 routes 目录下创建相应的文件。
mockjs 文档
提升列表页、表单开发效率
常规查询列表页
以下面原型为例

选择列表页区块

配置表单
https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/5b24b7d804ac4db1a3673fd2aa4aa4cd~tplv-k3u1fbpfcp-zoom-1.image
生成代码

若后端已经提供 yapi 接口文档,可以同时使用根据 yapi 接口文档生成请求方法的功能:

表单
选择表单区块,配置 Schema 表单

自定义区块
创建新的区块


配置 Schema 表单:支持 amis、formily、form-render,创建区块的时候根据自己需要选择相应的类型。