仿小米商城
amasne
这个作者很懒,什么都没留下…
展开
-
swiper6和vue-awesome-swiper4填坑
swiper6和vue-awesome-swiper4填坑 今天在 npm 安装swiper和vue-awesome-swiper的时候没指定版本,默认安装了最新的swiper6和vue-awesome-swiper4,然后就出现了各种效果调试不出来,各种报错,折腾了好一会儿 这里总结一下爬坑过程,要想使用vue-awesome-swiper4那就需要配合swiper5来使用,要使用vue-awesome-swiper3那就需要配合swiper4来使用,要使用vue-awesome-swiper3那就需要原创 2020-08-31 14:16:34 · 1250 阅读 · 0 评论 -
配置Mock
开发阶段,为了提高效率。需要提前Mock 本地加载请求静态json文件的形式(这里的跟目录是指的public目录) this.axios.get('/mock/user/login.json').then((res) => { this.res = res }) 通过easy-mock平台实现数据mock,点我进入官网 this.axios.get('/user/login').then((res) => { this.res = res }) 通过安装插件mo..原创 2020-08-29 15:20:27 · 696 阅读 · 0 评论 -
接口环境设置
开发上线的不同阶段,需要不同的配置 不同的跨域方式,配置不同 打包的时候统一注入环境参数,统一管理环境,输出不同的版本包 在scr目录新建一个env.js文件来配置不同的环境下,使用不同的参数 let baseURL // 在node中有一个process.env.NODE_ENV进程,可以取到环境变量中的参数 switch (process.env.NODE_ENV) { case 'development': baseURL = 'http://dev-xx-xxx.com/..原创 2020-08-29 12:42:15 · 344 阅读 · 0 评论 -
sessionStorage的封装
Cookie,localStorage,sessionStorage三者区别? cookie是网站为了标示用户身份而储存在用户本地终端(Client Side)上的数据(通常经过加密) cookie数据始终在同源的http请求中携带(即使不需要),记会在浏览器和服务器间来回传递 sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存 存储大小: cookie数据大小不能超过4k sessionStorage和localStorage虽然也有存储大小的限制,但比coo原创 2020-08-28 20:16:59 · 1104 阅读 · 0 评论 -
前端跨域解决方案
什么是前端跨域? 跨域是浏览器为了安全而做出的限制策略 浏览器请求必须遵循同源策略:同域名,同端口,同协议 怎么解决前端跨域? CORS跨域 CORS跨域-服务端设置,前端直接调用 说明:后台允许前端某个站点进行访问 JSONP跨域 JSONP跨域 - 前端适配,后台配合 说明:前后端同时改造 JSONP不是一个XHR请求,只是一段脚本而已 代理跨域 接口代理:通过修改nginx服务器配置来实现 说明:前端修改,后台不动 最常用的方式 在项目根目录下新建一个vue.c原创 2020-08-28 17:44:09 · 111 阅读 · 0 评论 -
仿小米商城的路由配置,插件安装,项目结构
未登录统一拦截 首先需要安装axios和vue-axios 安装好了之后需要在main.js中引入 import axios from 'axios' import VueAxios from 'vue-axios' Vue.use(VueAxios, axios) 根据前端的跨域方式做调整(此处使用的是proxy做代理) axios.defaults.baseURL = '/api' 对请求超时做处理(优化用户体验) axios.defaults.timeout = 8000 ..原创 2020-08-28 17:42:56 · 192 阅读 · 0 评论