梦学谷管理系统总结

Posted 2021-05-07 Frazier_梁超

团队协作/开发

规范/统一

开发规范

命名规范 （方法名，变量名 。。）

封装规范 (功能，参数，返回值，如何使用 。。。)

项目规范（主要模块，功能模块 ，组件，路劲，位置。。。）

开发项目

每日进度例会 / 检查

进度汇报

项目拆分

领取任务

时间预估

小结：梦学谷项目这里是团队开发的，我负责的模块是商品管理，首先就是API的封装，和拦截器的配置

API封装

import axios from 'axios'
axios.defaults.baseURL = "http://mengxuegu.com:9999/pro-api/"
export default {
	Member() {
		return axios({
			url: '/member/list',
			method: 'get'
		})
	}
}

拦截器的配置

//3. 设置请求拦截器配置
Server.interceptors.request.use(function(config) { //成功的时候
	console.log(config);
	config.headers.Authorization = sessionStorage.token;
	return config
}, function(error) { //失败
	return Promise.reject(error);
})

//4. 配置相应拦截器的信息
Server.interceptors.response.use(function(response) {
	if (response.status == 200) {
		return response.data;
	}
	return response;
}, function(error) { //失败
	return Promise.reject(error);
});

路由懒加载

	//* 商品管理路由
	{
		path: '/shop',
		name: 'Shop',
		component: () => import( /* webpackChunkName: "provider" */ '../components/shop/shop.vue'),
		meta: {
			bread: ['商品管理']
		}
	},

商品页面

就是传统的从接口获取数据，在进行布局 - 数据的渲染 - 样式的美化，

接下来的就是数据的增删改查，分页 搜索 ，

项目的过程中多层表单的嵌套比较难做，

就单说商品管理这个页面的 新增和编辑  里面都不太好做，我用了最笨的办法，写了好几个表单，在用两个变量控制着显示隐藏