一、概述 建议crud用ProComponents来开发，这样的效率更高一些，不管是umi hooks还是ahooks中的表格，表单等功能，不如它强大，它主要包含以下组件：ProLayout解决布局的问题，提供开箱即用的菜单和面包屑功能 ProTable表格模板组件，抽象网络请求和表格格式化 ProForm表单模板组件，预设常见布局和行为 ProCard提供卡片切分以及栅格布局能力 ProDescriptions定义列表模板组件，ProTable 的配套组件 ProSke...
原创
2021-06-02 13:55:14
1751阅读
ProComponents(适用于中后台的页面系列组件)学习:设计理念（一） 热水 2021.19 北京 个人QQ:28582157ProComponents官方地址：https://procomponents.ant.design/docs/intro一、前言： 传统...
原创
2021-06-02 13:55:13
1070阅读
1评论
一、页面水印组件：WaterMark ，根据需要是否给每个页面增加水印。二、卡片组件：ProCard 高级卡片，，用来增加效果。三、指标卡组件：StatisticCard 指标卡，经常用在页面上，常用于我的桌面，或者一些统计分析界面。四、骨架屏组件：ProSkeleton，类似进度条效果，用户有一个过渡，增强用户体验。五、ProField 原子组件：统一 ProForm、ProTable、ProList、Filter 等组件里面的字段定义。...
原创
2021-06-02 13:55:09
753阅读
一、概述 一个列表页面一般包括：页面的标题、面包屑（即页面路径）、页面的tab标签（可选）、工具栏按纽、表格（带高级搜索，排序等功能）、底部悬浮操作栏等。这就需要用到： （1）页面容器组件PageContainer： 自带标题、面包屑、tab标签栏、右上角公用操作按纽栏、底部按纽操作栏。 （2）高级表格组件ProTable: 自带搜索查询（高级查询）、表格分页、排序、列设置、刷新、全屏等功能及与服务端交互的能力。三、代码重点分析：（1）页面...
原创
2021-06-02 13:55:12
1288阅读
一、概述 适用于中后台的一种布局方案，即左边是菜单，右边是内容，它经常与PageContainer 配合使用，自动生成页面标题、面包屑，集成了页脚工具栏。二、ProLayout - 高级布局主要特性：1.动态从服务器取得菜单项;2.底部加页脚（公司版权信息）;3.IconFont的使用： iconfontUrl="//at.alicdn.com/t/font_8d5l8fzk5b87iudi.js"三、代码示例：<ProLayout style={{...
原创
2021-06-02 13:55:08
2238阅读
一、概述 主要为实现数以后在信息项的查看功能，简化做查看页面，这时候就要用到ProDescriptions组件。 （1）我们可以整个查看页面，来自远程服务的数据（例如数据库的）这时候可以整体设置ProDescriptions的request属性 + ProDescriptions.Item dataIndex。 （2）我们可以单独设置每个查看项的，通过：ProDescriptions.Item （3）也可以通过请求接口数据和 columns来展现，我...
原创
2021-06-02 13:55:10
1457阅读
一、概述 一个添加或者修改页面，通常包括： 页面标题、面包屑、表单，表单验证、固定底部的按纽栏等。这就涉及到：PageContainer页面容器组件+ProForm高级表单组件+ProFormFields 表单项（或者ProFormList、ProFormFieldSet、ProFormDependency ）。还有一些特殊的表单页面：例如Json来生成表单，则用SchemaForm，筛选条件的表单QueryFilter / LightFilter，分步操作的表单StepsForm、浮层弹...
原创
2021-06-02 13:55:11
2322阅读
EditableProTable默认是在单行保存时调用表单验证 我这里的需求是点击外部的保存要对整个表单进行验证 EditableProTable提供了editable属性,可以设置form https://procomponents.ant.design/components/editable-t ...
转载
2021-04-23 16:48:00
914阅读
2评论
官方说明
https://procomponents.ant.design/components/field/#%E8%BF%9C%E7%A8%8B%E6%95%B0%E6%8D%AE
ProFormSelect
在需要时调用加载
const handleCreate = (title:string) => { request('/api/services/app/AppUpdateFil
原创
2021-07-08 10:01:35
3580阅读
纯列表版效果展示：① 初始无值，展示为唤醒按钮+文案外链 ②点击按钮唤醒弹窗（简易版示意图） ③配置后 可编辑表格组件文档：https://procomponents.ant.design/components/editable-table 纯列表组件代码：表单引用：// antd-pro的高级表单组件
import Sch
转载
2024-03-06 15:55:05
126阅读
项目大纲前端React 18Ant Design Pro 5.x 脚手架Ant Design & Procomponents 组件库Umi 4 前端框架OpenAPI 前端代码生成后端Java Spring BootMySQL 数据库MyBatis-Plus 及 MyBatis X 自动生成API 签名认证（Http 调用）Spring Boot Starter（SDK 开发）Dubbo
转载
2024-09-15 06:58:14
293阅读
官方文档：https://procomponents.ant.design/components/editable-table项目的需求是点击操作栏的编辑按钮，有一个可编辑的表格，下面是官方的例子，表格实现功能是既可以通过表单中的某一个值来计算表单输入框中的项，又能通过用户自定义来输入(比如 状态根据活动名称来决定 ，同时支持用户自定义输入 )问题是，我初步尝试了以后，发现通过renderForm
转载
2024-03-25 07:48:58
79阅读
Ant Design Pro ProTable 基础配置说明ProTablecolumns基础使用遇到的问题建议最后 在此先说一下基础使用，后面再讲我遇到的问题基础配置说明配置也可以去官方文档，不过官方文档有些不是很全，我这里主要写一些基础需要用到的配置，补充一下官方文档没有的https://procomponents.ant.design/components/tableProTable属性描
转载
2024-04-30 17:14:59
87阅读
[VUE3] Element Plus 增删拆改页组件拆解组件拆解思路https://procomponents.ant.design/components/table/?current=1&pageSize=5一般按照我的理解，各部分功能区主要放置的东西如下所示。高级筛选栏：筛选条件 、重置、搜索标题栏：例如新建、导入数据、导出数据、批量操作等与表格多行操作相关的按钮等表格区域：表格数据
目录前言：碎碎念Columns配置ProTable的配置关于样式调整前言：碎碎念由于近期才接触到Ant Design Pro脚手架（以下简称antd pro），并且是第一次使用ProComponents的一些组件，对于自己碰到的一些小坑及样式修改比较耗费时间的地方，进行了记录。本文先说ProTable - 高级表格组件。如果你也对于ProTable 有在苦恼的问题的话，就请看下去吧。注：使用的脚手
转载
2024-03-18 20:44:15
781阅读
Ant Design 定义了基础的设计规范，对应也提供了大量的基础组件。但是对于中后台类应用，我们希望提供更高程度的抽象，提供更上层的设计规范，并且对应提供相应的组件使得开发者可以快速搭建出高质量的页面。在 ProComponents 中我们内置了一系列的设计规范，预设了常用的逻辑。在这个基础上我们同样提供了灵活的支持，比如对于 ProTable 来说你也可以把它完全当做 Ant De
Ant Design Pro v5 使用心得相比V4，V5到底强在哪？如何更改 title图标和加载时的页面？defaultSettings中菜单的几种模式及主题等配置国际化request 这篇文章主要是我在使用V5的过程中的一些发现以及遇到的坑，希望能够帮到大家，若有问题还请提出，谢谢！ 相比V4，V5到底强在哪？其实主要是ProComponents的功劳，我用它有两三个月了，在此记录一下使
转载
2024-02-19 18:33:05
48阅读
