Vue项目开发前要做的那些事（1）xhr封装

最近接了一个Vue的外包项目60张手机端的页面，15天3000块完成。天天码代码码到天亮，整个人像吸毒一样。客户的需求是Vue + vuex + axios + vue-router。

这是客户提供的 restFul API（第一次用这类API）

图1-1

这是客户提供的设计稿

图1-2

第一步肯定是构建项目我个人

比较喜欢用webpack这个模板的

vue init webpack 项目名称

这样构建项目的优点是项目的基本依赖都给你装好了额外要的配置就少了，测试环境都给你配好了。

接下来要做的就是封装公共的API来简化后期开发中重复的操作：

1、在src目录下新建一个Api的文件夹存放公共的函数和对象（如图2-1）

图2-1

2、xhr是用来与接口对接的、common.js是基础的公共函数如时间处理、cookie处理、字符串处理等操作。

昨天晚上看了一下axios的官方文档简单的封装了一下xhr对象

图2-2

方法调用方式很简单如图（2-3）

图2-3

以上代码不明白可以留言提问。下期分享：Vue项目开发前要做的那些事（2）种子项目搭建

接Vue外包项目，价格优惠，联系方式：

图3-3