您的当前位置：首页>全部文章>文章详情

【AntDesignPro】Ant Design Pro学习记录—搭建AntDesignPro脚手架

CrazyPanda发表于：2023-11-22 20:42:19浏览：589次TAG： #前端 #antd #AntDesignPro

文章目录

一、操作过程

2.完成后配置软连接

前言

工作项目需要，使用了AntDesignPro开发，在此做一个学习研究记录。

一、操作过程

参考官网开始使用 - Ant Design Pro🏆 让中后台开发更简单包含 table form 等多个组件。https://pro.ant.design/zh-CN/docs/getting-started

在node.js npm yarn 环境配置好之后，按照官网操作运行

1.初始化

npm i @ant-design/pro-cli -g

2.完成后配置软连接

ln -s /usr/local/nodejs/bin/pro /usr/local/bin/

3.继续执行

pro create myapp

接下来和官网一样，会让选择umi@3/umi@4,这里选择umi@3,然后选择完整版本complete，运行完成

4.进入应用

cd myapp

5.安装依赖

yarn

6.启动

yarn start

运行结果

猜你喜欢

: 【React】16 个实用的 React 库; Web开发中，经常会需要使用第三方库来提高开发效率。今天给大家分享16个非常实用的React第三方库，使用好这些库你可以更轻松、更快速的开发项目，让我们一起看看吧！1.react-hook-formReact-hook-form 是一个用于构建 Web 应用程序的表单库。它支持多种表单类型，包括输入框、下拉框、单选框、多选框等。它还提供了一些自定义选项，可以自定义表单的外观和行为。官方地址：https://react-hook-form.com/2.rechartsRecharts 是一个用于构; 发表于：2024-04-01 浏览：303 TAG：

: 【React】如何在 React 类中声明常量？; 使用 react 开发应用程序时，有必要声明常量来存储在组件或应用程序的整个生命周期中保持不变的值。常量可以帮助提高代码可读性，提供管理共享值的中心位置，并增强可维护性。在本文中，我们将探讨如何在 react 类组件中声明常量。导入 React首先，我们假设您已经设置了 React 环境并且有一个可供使用的类组件。在声明常量之前，请确保您已导入必要的库。这包括导入 React，它是在 React 中构建用户界面的核心库。import React from '; 发表于：2024-04-16 浏览：302 TAG：

: 【AntDesignPro】Ant Design Pro学习记录—播放视频和音频; 在ant design pro中，使用video和audio标签播放视频和音频1、播放视频我使用ModalForm弹框显示，autoPlay设置是否自动播放，controls设置操作按钮是否显示，设置好宽度和高度即可src是配置视频文件的链接<ModalForm         title="播放视频"        &n; 发表于：2024-05-17 浏览：451 TAG：

: 【AntDesignPro】Ant Design Pro学习记录—ProTable的使用（三）; 一、自定义检索条件部分列表页需要做一些简单的数据汇总统计，并能够跟随检索条件自动变化，protable自带的功能没有找到对应的实现方法，最后决定自己来实现这个功能。1、关闭ProTable自带检索功能search={false}2、自定义检索表单在ProTable上方加入自定义表单<Card bordered={false} style={{ marginBottom: 15 }}>     ; 发表于：2024-02-20 浏览：482 TAG：

: 【AntDesignPro】L7Plot地理可视化组件的使用; L7Plot介绍L7Plot 基于 L7 实现的开箱即用地理空间数据可视化图表库L7Plot 专注于地理可视化图表。以声明配置式的方式，降低用户使用成本；以常见地理图表分类的方式，降低用户选择成本；内部集成全国行政区域数据，降低用户使用地理数据心智；支持多图层及多图表层叠，方便用户定制复杂的业务场景；L7Plot 专注于地理数据可视化展示，不会涉及数据编辑能力。前言项目需要，使用antdesignpro做前端，并绘制可视化大屏，回执地图组件，于是使用了L7Plot。功能目的绘; 发表于：2023-12-14 浏览：670 TAG：

: 【AntDesignPro】使用高德地图设置考勤区域; 参考高德开放平台https://lbs.amap.com/api/javascript-api-v2/guide/abc/amap-react功能要求：使用AntDesignPro开发系统管理端，考勤模块需要设置APP考勤打卡区域，需要页面显示地图定位并设置考勤范围（地图上画圈），以便APP在画圈范围内打卡使用。1、准备2、下载react类组件代码参考官网流程，可正常加载出地图组件，下面是我的页面和组件文件组件文件3、安装并引入AmAP Loadernpm i @ama; 发表于：2023-12-14 浏览：761 TAG：

: 【AntDesignPro】Ant Design Pro学习记录—ModalForm的使用（一）; 目录前言一、ModalForm销毁二、ModalForm编辑赋值三、ProFormUploadButton赋值四、其它总结前言使用了AntDesignPro，仿照TableList创建了自己的列表，列表添加编辑确成了困扰，添加编辑使用了ModalForm，有两个问题，一个使用后，页面数据无法清除，再点弹框还是原来的数据，第二个编辑的时候，初始数据赋值问题。AntDesignPro版本V5，开发工具VsCode。一、ModalForm销毁参考ant design的关闭ModalForm和Modal; 发表于：2023-11-28 浏览：641 TAG：

: 【AntDesignPro】Ant Design Pro学习记录—ProTable的使用（一）; 目录一、关于ProTable二、使用步骤1.新建页面2.修改接口3.接口调用4.数据显示和检索1）不同类型内容显示2）列表检索3）列表内容样式设置5.其它1）render的简单使用2）图片点击预览3）翻页总结前言因为项目需要，确定了Ant Design Pro框架来开发后台管理端，刚接触这套框架，而且配套的资料真的很少，只能基于官方demo和网上不完整的学习经验一次次尝试，终于有个像样的结果，记录一下研究学习的成果，也给需要的同学一些帮助。本次学习研究基于Ant Design Pro V5版本，; 发表于：2023-11-28 浏览：835 TAG： #前端 #antd #AntDesignPro

: 【React】react面试题; React面试题文章目录React面试题一、react特性***React与Vue的区别*******1. Jsx的使用规范*******1.说说对 React 的理解？有哪些特性？DOM2.说说 Real DOM 和 Virtual DOM 的区别？优缺点？*******说说React中的虚拟dom？在虚拟dom计算的时候diff和key之间有什么关系*******3.说说React Jsx转换成真实DOM过程？4.说说你第mvc和mvvm的理解5.说说react中引入css的方式有哪几种？区; 发表于：2023-12-05 浏览：1417 TAG：

: 【React】使用React实现一个内容滑动组件; 最近在做项目时遇到一个需求，需要让一个列表能够通过点击按钮进行滚动，每次都是一屏的距离，不足则结束。并且，这个列表项是在react-grid-layout中的某一个模块内。所以包裹这个列表的容器会随时发生变化。在完成这个组件后，通过这篇文章总结一下。UI/原型分析那么从上面的功能描述以及项目中的UI，我们可以分析得到这样一个假想图：我们需要实现一个容器来作为我们的可视区域，并且这个容器是可以伸缩的。列表内容如果超出容器的可视区域，那么就会被隐藏。需要左右都有按钮，来支持用户左右滑动内容来查看，每; 发表于：2024-04-10 浏览：330 TAG：

栏目分类全部>

推荐文章

