如果你不知道什么是ant，请不要浪费你的时间继续读下去了。或者你对ant是什么感兴趣，可以看这里：wikipedia-ant 或者这里 baidu-ant最近整理了一下ant的下载和安装方法，步骤如下：1.下载ant：官网下载当前最新版是Apache Ant 1.9.3，可以下载那个zip包，如下图：2.将下载的zip包解压到一个目录下，如/usr/local。这时候需要你提供
下面是两种方式：1、动态菜单+固定路由2、动态菜单+动态路由两者都可以实现需要，但都各自有优缺点主要代码：在app.tsx中设置和请求服务器菜单数据注意点： 1、服务器返回的数据尽可能可前端所需要的数据保持一致，且结构一致。 2、下列请求服务器动态菜单数据，可以在初始化数据时保存到用户信息里。
转载
2024-03-18 20:33:32
230阅读
1、开始学习ant-design-pro，安装啥的自动忽略，参考文档：https://pro.ant.design/docs/getting-started-cn根据文档学习，添加页面，新增组件都没问题，可以跟着做，但是到了和服务器交互时就有点蒙了，因为ant-design-pro采用了dva框架实现，前段使用react技术，对于只有后台开发经验的我还停留在springmvc 的工作模式上，对于a
转载
2024-04-29 11:05:26
203阅读
准备正式开发前需要准备一个IDE，如果是用纯记事本的大神请忽略可以选Sublime和VsCode等，找个自己用过的顺手的反正我都没用过，跟随我软的脚本我就选VsCode把在VSCode里添加一个工程，选定上一章克隆下来的工程文件夹目录然后再保存下工程文件开始Ant Design Pro的前端框架是阿里自己弄的UmiJS菜单配置可以看下官方的文档它 的菜单配置在config的router.confi
转载
2024-04-08 19:12:40
156阅读
ant design pro来源于ant design，其是一段自带样式的react组件，用于企业后台的漂亮的，可控的组件。ant design有很多组件和样式，不可能所有都记住，我们只要记住常用的，遇到不常用的，学会查文档就可以了
因为ant design很强大，阿里有些大神就直接将ant design继续向上封装成一个完整的项目，这就是ant design pro，注意ant design p
转载
2024-02-25 13:12:53
198阅读
Ant Design 是一个基于 umi、dva 和 ant design 的开箱即用的中台前端/设计解决方案。一、umi和dva1.1、什么是umiumi，中文可发音为乌米，是一个可插拔的企业级 react 应用框架。umi 以路由为基础的，支持类 next.js 的约定式路由，以及各种进阶的路由功能，并以此进行功能扩展，比如支持路由级的按需加载。然后配以完善的插件体系，覆盖从
转载
2024-08-21 07:18:52
169阅读
我以下的方式，其实并把Ant Design Pro文件打包到生成的安装包里，所以，安装包=Ant Design Pro+Electron环境
ant-design-pro ----> version ：2.3.1
由于网上Ant Design Pro+Electron的资料太少，我就贡献一点经验
转载
2024-08-19 20:15:35
151阅读
文档总览 - Ant Design Pro开始使用Ant Design Pro 是基于 Ant Design 和 umi 的封装的一整套企业级中后台前端/设计解决方案，致力于在设计规范和基础组件的基础上，继续向上构建，提炼出典型模板/业务组件/配套设计资源，进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的体验。随着『设计者』的不断反馈，我们将持续迭代，逐步沉淀和总结出更多设计模式和
转载
2024-06-25 19:04:10
105阅读
在之前的系列文章中，我们讲解了如何快速使用Ant Design Pro解决方案来快速搭建前端框架。而ECharts是前端最流行，功能最强大的前端图表库。下面，我们将会在本文中讲解如何在Ant Design Pro使用ECharts。安装首先，如何在Ant Design Pro解决方案下安装ECharts呢？ Ps：关于Ant Design Pro的基本知识可以访问如下文章进行了解：&n
转载
2024-05-22 19:51:41
213阅读
微服务现在挺火的,优点也很明显如果有多个应用都有相同页面时,就可以使用微服务,可以避免重复写代码 在网上搜了下,很多例子都是基于官方文档的例子,官方文档:https://umijs.org/zh-CN/plugins/plugin-qiankun.比较简单,实际使用场景会有特殊情况我根据自己项目的情况总结了一下使用方法 我们两个项目都是ant-design-pro的,我这里的例
转载
2024-06-19 04:19:43
99阅读
Ant Design Pro 浅析脚手架下载Ant Design Pro 浅析菜单映射页面渲染界面定义数据交互后台数据交互 脚手架下载软件环境：NodeJS，Git 下载步骤：1、clone代码。其中ant_design 为文件夹名$ git clone --depth=1 https://github.com/ant-design/ant-design-pro.git ant_design
$
转载
2024-04-29 23:02:18
108阅读
一、概述在日常开发中，往往是前后端分离的，这个时候约定好一套接口标准，前后端各自独立开发，就不会被对方的技术难点给阻塞住，从而保证项目进度。在 Ant Design Pro 中我们已经有了一套比较完善的 mock 功能，而 roadhog-api-doc 工具，则能够从项目的 mock 数据中读取接口信息生成对应的文档，这样就能够更加清晰明了的展现项目的接口情况。效果如下：Pr
转载
2024-05-12 18:37:51
72阅读
Ant-design-pro 简述Pro 是由蚂蚁金服团队出品， 基于dva及ant-design进行开发与维护的脚手架，包含ant-design所有组件使用与封装，是ant-design的最佳实践。Pro致力于打造一款开箱即用的优秀前端开源框架， 但你仍需要掌握dva，react，redux相关基础知识。Dva是redux数据流解决方案，让redux与react的使用变的简单。因此，即便你不理解
转载
2024-09-02 12:43:11
133阅读
go-admin-pro依旧是前后端分离的项目结构，前端使用的antd pro React最新版本V5版的基础上进行开发，服务端是在原go-admin的基础上再做优化升级的一个版本。以上图片是默认使用了antd官方的工作台页面布局； 以上图片是默认使用了antd官方的分析台页面布局，后台数据自动化，以后方便大家可以参考；用户管理界面，可以根据组织来过滤用户数据，编辑用户信息或者新建用户等
转载
2024-05-06 06:11:59
492阅读
一、概述1.1、脚手架概念 编程领域中的“脚手架（Scaffolding）”指的是能够快速搭建项目“骨架”的一类工具。例如大多数的React项目都有src，public，webpack配置文件等等，而src目录中又包含components目录等等。每次在新建项目时，手动创建这些固定的文件目录。脚手架的作用就是帮助你完成这些重复性的工作，包括一键生成主要的目录结构、安装依赖等等。1.2、参考地址
转载
2024-03-28 13:36:59
236阅读
1.目录结构2.开发流程示意图菜单配置文件ant-design-pro\src\layouts\BasicLayout.js路由配置文件ant-design-pro\src\pages\.umi\router.js ant.design的栅格系统 在 ant.design 中，对于栅格系统的设计和bootstrap中的设计是极其类似的，核心概念为： Row一定是最外层的， C
转载
2024-02-19 00:25:00
94阅读
先上一些官方的话Ant Design Pro 是一个企业级中后台前端/设计解决方案，我们秉承 Ant Design 的设计价值观，致力于在设计规范和基础组件的基础上，继续向上构建，提炼出典型模板/业务组件/配套设计资源，进一步提升企业级中后台产品设计研发过程中的『用户』和『设计者』的体验。随着『设计者』的不断反馈，我们将持续迭代，逐步沉淀和总结出更多设计模式和相应的代码实现，阐述中后台产品模板/组
转载
2024-05-22 15:48:44
93阅读
前言：前一篇记录了【后台管理系统】目前进展开发中遇到的一些应用点，这一篇会梳理一些自己学习Ant Design Pro源码的功能点。附：Ant Design Pro 在线预览地址。 Dashboard指示板pages/Dashboard 目录下：Analysis.js分析页、Monitor.js指控页、WorkPlace.js工作台用到的一些技术点：react v16.6 动态
转载
2024-05-07 12:09:22
54阅读
前言权限是后台管理系统常见的需求，后台开发必须考虑设计的模块，antd-pro给我们提供了很好的关于权限的封装，我们只需要在配置菜单的时候配置上准入身份，在登录成功以后获取到登陆者身份以后更新登录人身份参数即可。 效果： 1、没有准入权限的菜单将不显示 2、直接在浏览器输入没有准入权限的的地址，将跳转到403页面（图1）
图1.直接输入地址但却没有权限
转载
2024-04-01 11:42:25
518阅读
一、概述二、详细2.1、构建当项目开发完毕，只需要运行一行命令就可以打包你的应用： npm run build 由于 Ant Design Pro 底层使用的 roadhog 工具，已经将复杂的流程封装完毕，对于大部分场景，构建打包文件只需要一个命令 roadhog build，构建打包成功之后，会在根目录生成 dist 文件夹，里面就是构建打
