antd.pro最近更新额V5版本，于是使用了最新的版本。V5版本抛弃了dva的数据流配置方式(狗头：原因就是配置太繁琐了，你要为每个module配置module文件，并且使用generator的方式作异步请求，然后在请求service.......，)，对于刚入手antd.pro的童鞋来说十分的不友好，我在接触V4版本的时候，花了两天的时间才完全打通了所有的环节。V5就相对来说简单的多了，好处的
Ant Design Pro中路由的使用一. 介绍在 Umi 应用是单页应用，页面地址的跳转都是在浏览器端完成的，不会重新请求服务端获取 html，html只在应用初始化时加载一次。所有页面由不同的组件构成，页面的切换其实就是不同组件的切换，你只需要在配置中把不同的路由路径和对应的组件关联上。1. 路由样例export default [
{
path: '/application',
转载
2024-04-15 14:08:08
147阅读
1、以数组的形式获取表单中同一行两个input数值，可将Form.Item的字段名写为数组形式,表格提交之后的数据就可以数组形式呈现，方便传递后台取值。<Form.Item
name={['position', 'position_x']}
rules={} />
<Form.Item
name={['position', 'position_y']}
rules
转载
2024-02-19 18:22:47
262阅读
Ant Design Pro 是一个基于 umi、dva 和 ant design 的开箱即用的中台前端/设计解决方案。一、umi和dva1.1、什么是umiumi，中文可发音为乌米，是一个可插拔的企业级 react 应用框架。umi 以路由为基础的，支持类 next.js 的约定式路由，以及各种进阶的路由功能，并以此进行功能扩展，比如支持路由级的按需加载。然后配以完善的插件体系，覆盖从
转载
2024-03-10 21:37:50
190阅读
# 如何实现“ant design pro v5 javascript版本”
## 引言
在实现“ant design pro v5 javascript版本”之前，你需要了解一些基本知识。首先，你需要了解什么是“ant design pro v5”。Ant Design Pro是一个开箱即用的中台前端/设计解决方案，它基于React实现。它提供了一套完整的中台前端解决方案，包括可视化布局、权限
原创
2023-08-14 12:35:36
698阅读
一.动态路由1.1动态路由原理基于某种路由协议实现1.2动态路由特点减少了管理任务占用了网络带宽减少管理任务:只需配置，配置完之后我只要把各个网段宣告出去占用网络带宽:1、无需管理员手工维护，减轻了管理员的工作负担。2、占用了网络带宽。3、在路由器上运行路由协议，使路由器可以自动根据网络拓朴结构的变化调整路由条目4、网络规模大、拓扑复杂的网络1.3动态路由的概述动态路由就是路由器之间交换信息的语言
前端初学者的Ant Design Pro V6总结（上）前端初学者的Ant Design Pro V6总结（下） 文章目录@umi 请求相关一个能用的请求配置Service层 TS 类型规范Service层 函数定义@umi 请求代理 Proxy@umi/max 简易数据流useModel 没有类型提示？useModel 书写规范ProForm 复杂表单当外部数据发生变化，ProForm不更新？P
Ant Design Pro v5 使用心得相比V4，V5到底强在哪？如何更改 title图标和加载时的页面？defaultSettings中菜单的几种模式及主题等配置国际化request 这篇文章主要是我在使用V5的过程中的一些发现以及遇到的坑，希望能够帮到大家，若有问题还请提出，谢谢！ 相比V4，V5到底强在哪？其实主要是ProComponents的功劳，我用它有两三个月了，在此记录一下使
转载
2024-02-19 18:33:05
48阅读
Ant Design Pro
在经过了很长时间的准备下，Pro V5 已经基本完成， 但是仍然有很多地方不是很完善，在新版本中我们进行了很多预设，对于数据流和布局更是进行了大刀阔斧的改进。虽然底层仍然基于 umi@3 来实现的，但是在应用层做了很多改动，接下来我们会展示一下我们的主要改动。Layout 的更新layout 是这次的最大改动，首先是进行了样式上的更新，支持混合
转载
2024-05-12 13:31:03
163阅读
官网网站开箱即用的中台前端/设计解决方案https://pro.ant.design/zh-CNGitHub网站GitHub - ant-design/ant-design-pro: ???????????????????????? Use Ant Design like a Pro!先去GitHub将代码全部下载下来用Visual Studio Code执行yarn 然后执行npm start也可以用cmd进入目标文件夹执行yarn create umi 或 npm creat
原创
2021-10-16 11:25:29
5089阅读
系列文章目录提示：写完文章后，目录可以自动生成，如何生成可参考右边的帮助文档 文章目录系列文章目录前言一、展示地图二、getList获取列表数据三、写入marker标记在页面中1、marker的官方文档2、setMarks方法3 点击事件4 学习心得5、补充：让所有marker点展示在地图内自动缩放总结 前言不是之前的手机端项目系列，但是可以参考，以后肯定用得到！我的需求getList获取数据，然
页面请求后台API，由于前端的端口是8000，后端api的端口是5000，所以无法访问，官方的代理教程在下面链接中代理https://pro.ant.design/zh-CN/docs/proxy这里讲2中方法方法1fetch跨域问题，一种方法使用代理package.json文件增加一个字段"proxy": "http://localhost:5000",方法2修改config文件夹下proxy.jsexport default { dev: { '/api/': {
原创
2021-10-22 16:26:47
1714阅读
antdprov5新建文件夹，alt+D 输入cmd打开终端yarn create umi
//一系列设置后
//安装依赖
yarn install
yarn start
//检查错误和代码格式化，快捷键是：光标在文档中任何位置，再shift+alt+l
npm run lint新建1.src/pages/BasicList文件夹，文件夹里面新建index.tsx和index.less，r
转载
2024-06-20 17:24:16
255阅读
前端采用蚂蚁金服的前端集成框架：ant-design-pro， 官网：https://pro.ant.design/前端采用ant-design，其中是用react写的，所以针对后端开发人员而言，学习也不是那么快，该文章用于能够快速的让后端人员上手。 注意：下面介绍的是基于ant-design-pro的v2.x版本一、主要文件这里主要介绍，平常开发中可能用到的一些文件，这里分为两类：配置文件 界面
转载
2024-03-06 23:36:23
36阅读
antd pro是一个企业级中后台前端/设计解决方案，完善的UI组件，权限管理，以及最新版本使用umi ui进行区块管理，可以帮助我们快速开发开台，antd pro技术栈主要使用antd+dva+umi，关于dva和umi好多童鞋很陌生，下面让我们看下dva和umi是什么？在学习dva和umi之前，先让我们看下antd pro目录结构是什么样是不是感觉很熟悉，和vue的目录结构基本差不多。一、dv
转载
2024-03-28 06:34:39
243阅读
实现思路1.页面展示需要鉴权的所有按钮，需要先鉴权菜单权限的显示与隐藏。2.勾选每个角色或者用户所能看的权限保存在数据库。该权限数据是一个权限字段的数组。3.全局自定义指令（directive）控制按钮权限数据的方法，登入时获取后端传来的按钮权限数组。4.在每个按钮中调用该指令，并传入该操作的权限字段和后端保存的权限字段进行匹配，能匹配则该操作按钮可显示具体代码如下获取登录用户所有权限// 获取权
转载
2024-06-30 05:42:32
165阅读
我们知道，当下最火的前端框架，非蚂蚁金服的 AntDesign 莫属，这个框架不仅在国内非常有名，在国外GitHub上React前端框架也排名第一。而且这个框架涵盖了React、Vue、Angular等多种语言，甚至有人结合.net Core 5的新特性WebAssembly 做了Ant Design Blazor，在此为国人点赞！公司的新平台，用户前端界面当仁不让地使用了An
转载
2024-05-08 23:18:18
202阅读
一、概述 建议crud用ProComponents来开发，这样的效率更高一些，不管是umi hooks还是ahooks中的表格，表单等功能，不如它强大，它主要包含以下组件：ProLayout解决布局的问题，提供开箱即用的菜单和面包屑功能 ProTable表格模板组件，抽象网络请求和表格格式化 ProForm表单模板组件，预设常见布局和行为 ProCard提供卡片切分以及栅格布局能力 ProDescriptions定义列表模板组件，ProTable 的配套组件 ProSke...
原创
2021-06-02 13:55:14
1751阅读
1.在app.tsx中定义了页脚子组件，如下：2.找到src/components/Footer子组件，然后修改里面的内容例如即可：
原创
2021-06-04 18:59:20
930阅读
界面的水印水印是 PageContainer 的功能，layout 只是透传给 PageContainer屏蔽方法，找到文件src/app.jsxexport const layout = ({ initialState }) => { return {
原创
2021-11-13 14:01:45
6126阅读
