MangoStore
简单示例一些项目基本操作
阿星始于现在
未来前端之星
展开
-
Ant Design Pro使用操作说明--(1) 搭建项目
一套全新升级的最新的超详细的umi+Antdpro的中后台管理系统的搭建和使用,希望可以帮助到各位。react(umi+dva+antdpro)~原创 2020-12-19 18:00:39 · 1323 阅读 · 4 评论 -
umi+dva+antd后台管理系统(7)---table表格的增删
oho~,这两天有事,今天继续写啦!先来个删除把,比较简单的稳一下心情。1. 删除1、首先还是一样的,先定义一个请求~// 删除所选商品export const Dele=(id)=>{ return instance.POST("/api/crud",id)}2、然后定义model发起请求的方法delete~export default { namespace:...原创 2020-01-17 15:32:31 · 987 阅读 · 0 评论 -
umi+dva+antd后台管理系统(6)---table数据的改查
数据的增删改查!源码在这儿MyGithub,觉得不错留颗小星星哦~1. 修改效果:点击编辑按钮,跳转修改页,并且商品信息传过去!!先做个简单的表单,制作修改页...原创 2020-01-17 10:46:02 · 1187 阅读 · 0 评论 -
umi+dva+antd后台管理系统(5)---dva loading
在开始增删改查之前,我又加了个加载数据的loading效果~1. loading效果其实也不难,我的思路是:初始化设置loading为false,在发起网络请求的时候更新为true,展示加载状态,待数据请求过后,同步数据的时候,loading重新设置为false即可。然后UI组件那边负责接收这个loading和展示这个 loading即可。models:export defaul...原创 2020-01-10 11:09:55 · 2628 阅读 · 0 评论 -
umi+dva+antd后台管理系统(4)---展示数据
废话不多说,今天事多,希望标题功能一上午能写完 ,开干!ok,先修改了一下界面,展示一下我要实现的功能。 如图:1. antd找了一个table表格2. 发网络请求填数据定义一个发请求的方法 //获取商品列表export const list =()=>{ return instance.GET('/api/detail')}在componentDi...原创 2020-01-09 18:51:49 · 1114 阅读 · 0 评论 -
umi+dva+antd后台管理系统(3)---完整登录逻辑
界面准备好啦,登录操作开始:1. 回顾一下redux是什么redux 是一个应用数据流框架,主要解决了组件间状态共享的问题,原理是集中式管理,可以让数据更可控,react 中所有数据处理都在 redux 中进行,三个核心方法,action、store 和 reducer。在 redux 中遵循的原则:1. 一个项目只能有一颗数据树。2. 所有的数据改变都需要在 reducer 中进行...原创 2020-01-08 21:16:31 · 4472 阅读 · 1 评论 -
umi+dva+antd后台管理系统(1)---开篇搭环境
前段时间刚接触umi和dva,也不敢用脚手架,一步一步创建每一个页面去逐渐解开这对cp的面纱,差不多要写完了,朋友接口的数据出了问题,决定换之前自己写的接口重写,借着重写,记录下每一步,每一个功能如何去实现,之前写的也有记录,但是时间久了全部重新捋一遍不如重新写一遍,再练一遍~搭建环境工具 :脚手架 create-umi环境:node v12.9.0 umi 2.12.7 yarn ...原创 2020-01-06 21:51:50 · 2271 阅读 · 0 评论 -
umi+dva+antd后台管理系统(2)---初始化界面布局,实现路由嵌套
拉框架设置布局我选了antd的响应式布局效果如下:我换了导航,如图:下一步我要实现路由嵌套导航功能,umi自动生成路由,在此之前我要把配置改成哈希路由,不用浏览器历史记录路由。还是在.umirc里:写之前,我又改了一下样式:我没有合适的Logo图片。。。将就用吧。。。约定式路由失效奇怪,我在pages里写的页面没有自动生成路由,又自习看了下官网,发现:那也就是说...原创 2020-01-07 21:32:27 · 3497 阅读 · 1 评论