weixin_45654455的博客

原创 vue项目PC端页面内嵌微信扫码登录

这里需要注意的是获取token是根据回调地址中的参数code然后传给后端进行获取的。这里的回调地址必须是当前项目的页面，这样才能得到code参数，而且回调地址必须是外网可以访问且要和微信配置中的回调地址一致，所以联调测试时需要部署到线上进行测试。因为一些参数是直接调接口得到的所以这个data就是接口返回的数据。二维码出来后就要获取token根据token获取用户信息了。然后传给后端接口，的到后端返回的用户信息即可。根据需求需要内嵌一个微信扫码登录获取用户信息。只需要监听路由判断路由中是否有code。

原创 vue2项目使用瀑布流

瀑布流布局是常见的布局方式，因为需求原因前端需要在手机横屏的情况下展示瀑布流的布局方式。百度了瀑布流的布局原理和方法。开始是想用简单的css样式布局就是multi-column 多栏布局但是这个布局只能满足从左到右。因为使用场景是手机横屏的情况下进行展示，所以这种方法是不可取的，

原创 vue项目中使用el-table表格动态拖拽数据，并根据拖拽滚动条也下拉

但是如果数据过多，表格会出现滚动条这时候拖拽就只能一个个的往下拖拽，所以针对这个问题优化了随着鼠标拖动滚动条也往下拖动。绑定row-key为后端的拖拽顺序。在表格上监听鼠标点击，抬起和移动事件。1 使用sortablejs插件。项目中实现动态拖拽表格数据。然后使用表格的ref的监听。在mounted中引入。

原创 vue系统长时间未操作自动跳出登录

由于系统的安全性考虑，系统添加长时间操作自动跳出，跳到登录页面。首先在util文件夹下面创建一个js。设置时间是30分钟未操作，自动退出。然后再main.js里面引入。

原创 vue项目解决刷新浏览器，tag栏消失

原创 vue动态变换项目背景色

根据接口返回的背景类型，在man.js中判断使用的背景类型。Newcloor是针对大块的div样式的改变。global文件是基础公共样式设置。darkChange文件是深色版样式。lightColor文件是浅色版样式。然后main.js中引入样式文件。在style文件中创建。

原创 vue项目中菜单切换后取消上一个页面未响应完成的接口

疯狂点击切换菜单页面时由于某些原因接口响应慢的情况的页面响应数据会出现卡顿现象，针对这种情况采用了切换菜单取消上一个页面未响应完成的接口。3 会发现浏览器中会有报错信息是因为我们拦截了接口的调用后接口就会报错但是我们接口的响应拦截并没有处理取消调用的报错信息。首先先在requrst.js页面创建全局变量。通过router.beforeEach事件。2 判断路由变化时进行接口的取消操作。所以在响应拦截器的error方法中添加。1 监听request拦截。

原创 构建Postman 形式页面

首先 输入query参数，url地址连相应参数的进行动态拼接，在url输入框中改变参数，相应的query表格蚕食进行动态改变。this.form.requestParams是对应的query列表参数。如图前端实现类似postMan形式的api配置页面。

原创 vue项目中渲染JSON数据到页面

写项目时需要做到的功能，后端通过接口返回JSON数据，前端把JSON格式的数据渲染到页面中并显示样式。1 首先需要创建一个div盒子，通过v-html进行渲染。3 调用方法进行JSON数据格式样式的构建。2 获取JSON数据。