![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
工作简记
文章平均质量分 51
张刻骨
未曾见过网洋大海,怎能止步于江河湖泊?
展开
-
vue-matomo页面数据采集插件,在ios系统中undefined不生效问题解决方案记录
先上使用说明步骤:1.main.js文件中使用该插件2.在路由中配置需要跳过统计的页面路3.在需要统计的页面初始化时植入统计代码:在按钮中植入点击统计埋点:这样就完成了;但是上线后却发现在ios端不能正常采集数据,在安卓上可以正常采集数据;查看matomo官档后,发现如下提示:按要求将测试站点的http的地址换成https的地址后,再上线用ios手机采集信息正常获取到了数据信息,安卓也正常,所以确定是因为采集站点http在ios系统中没有得到授权认证等问.原创 2021-01-15 17:44:47 · 809 阅读 · 2 评论 -
ant-design-vue中的视频上传组件upload自定义本地预览视频、校验视频类型、校验上传视频文件大小等功能
新项目中需要用到新闻视频上传功能,UI组件库采用的是ant-design-vue,所以就用里面的upload组件改造自定义了一个视频上传组件。上代码:关键定义点在于1.校验视频文件大小: //校验 文件大小 checkSize(file, size) { let that = this return new Promise(function (resolve, reject) { if (file.size / 1024 > s原创 2021-01-13 16:56:02 · 11110 阅读 · 23 评论 -
解析jeecg-boot的数据字典,涉及到了vue的组件封装、ajax请求等
jeecg-boot中的数据字典本质其实是一个封装好的组件,然后在使用时单独传入后端给的code码给组件需要的字段,在数据字典组件里再通过接收到的code码发起ajax请求从而获取字典数据。字典组件html结构如图:定义props属性,用于从父组件获取数据字典组件所需的数据信息,具体如下:下面是对该组件处理数据的部分了:然后是关键逻辑了:接下来看看在业务组件里的使用是神魔样子的吧!这里数据字典表格中是这样用的,原理和上面差不多,都是事先封装好组件和取字典的通用..原创 2021-01-13 13:46:17 · 2072 阅读 · 6 评论 -
对jeecg-boot项目的前端可复用功能的分析(关键依赖于vue的mixin)
将可复用功能提取,用到vue的mixin技能;上图为jeecg中定义可复用功能的mixin.js,关键步骤如图圈中点:引入vue,export暴露对象,定义所需的data数据、钩子函数、methods方法。下面是在目标组件中的使用:在使用jeecg时发现一个规律,也是mixin混入的特殊点:当某个组件中存在与mixin对象相同的选项的时候,组件的选项会覆盖mixin的选项,执行组件的内容。特别的是,以上面的loadData()加载列表数据函数为例,我在组件中单独定义一个函数,手动调用l..原创 2021-01-13 10:53:56 · 812 阅读 · 0 评论 -
原生js请求ajax时关于隐藏url上的参数处理方法记录
忙碌的一年又一年,好久没来看我的博客了,充实的时光总是让我成长,这一年又积累了很多新技能新知识新视野,今天好不容易有点空闲,赶紧记录一下刚刚给人解决的小问题吧。下面直接上我给的解决方案哈:核心思路就是把参数以post方式传输;用到的具体知识点如下:封装模拟类函数function HideParams(url,param){//创建表单 let formDom = document.body.appendChild(document.createElement('form'..原创 2021-01-12 16:50:32 · 1951 阅读 · 1 评论 -
vue项目中:PC端导出csv或excel数据表方法及其移动端导出表格方法
需求是在前端导出人员明细表,后端只给提供json格式的数据,函数方法如下:一:第一种方法:(不可移动端导出)//导出明细csv格式(纯前端导出)getExport(){//this.getDetailList();if(this.startTime&&this.endTime){exportAccess...原创 2020-03-05 15:05:00 · 1413 阅读 · 0 评论 -
vue项目的登录处理之路由守卫router.beforeEach(),用户在未登录状态下,展示的一直是登录界面。
简单记录一下需求处理,当项目中的除了登录页或其它一两个页面不需要用户登录数据,其它页面均需要登录信息才能正常展示,那么就要做路由全局守卫了,回调函数中的参数,to:进入到哪个路由去,from:从哪个路由离开,next:函数,决定是否展示你要看到的路由页面。如下例:main.js中设置全局守卫在main.js中,有一个路由实例化对象router。在main.js中设置守卫就是全局守卫。...原创 2019-12-30 16:01:22 · 1138 阅读 · 0 评论 -
移动端IOS不兼容的情况处理小结
一.vant的导航tab标签产生的ios不兼容问题:1.用了vant的tab标签页,使用吸顶模式在苹果机上会出现一个返回此页面后列表顶部tab分类标签消失的情况:正常样式在苹果机上顶部的导航条标签消失了(使用的吸顶,浏览器渲染后结构里自动换成fixed属性) 解决:考虑到页面的 fixed 元素失效,所以当页面超过一屏且滚动时,失效的 fixed 元素就会跟随滚动了...原创 2019-12-30 15:46:40 · 2974 阅读 · 0 评论 -
vue项目引入腾讯移动分析平台统计页面浏览量和功能按钮点击量的具体方法步骤
步骤如下:1. 打开网址, 使用自己的QQ登陆http://mta.qq.com/2. 点击"我的应用" 0-> "HTML5应用" -> "新建应用", 此处已经新建好了一个, 如果要给按钮添加监听事件, 查看按钮的点击次数, 记得勾选"自定义事件".新建应用2.点击自己应用的右上角管理,复制如下代码, 添加到index.html页面中去, 放在title下面...原创 2019-12-30 14:54:11 · 2400 阅读 · 1 评论 -
vue项目开发的H5单页应用放进微信公众号进行微信分享的几个重要步骤
2实在是太忙了,许久不曾有空更新,对不起我的博客,冷落了它~~直接上需求,我们的vue开发H5单页应用封进微信公众号进行使用,其中有一个重要的微信分享功能,第一次接触,正经八百踩了好几个坑。1.wxShare是我封装好的接口,需要发起请求获取微信分享认证授权后才能设置分享项和分享样式信息。、对上面的进行补充修改:苹果手机二次分享签名失效,因为后面被加上了苹果的参数,用enc...原创 2019-12-26 16:15:56 · 2086 阅读 · 6 评论 -
解决clone项目install后运行报错:No ESLint configuration found的问题和vue深度选择器的使用;
1.报错内容:npm intall后npm run dev运行报错2.解决办法:解决办法详细解说总结:该错误主要两个命令:第一个命令是npm install eslint --save-dev;第二个命令是配置eslint: ./node_modules/.bin/eslint --init 初始化配置文件;此配置文件配置好之后,vscode编辑器自动...原创 2019-09-16 17:46:07 · 1728 阅读 · 0 评论 -
关于mintUI中popup弹层和datePicker的使用中各种文档不全自行摸索的记录
该项目中选用了mintUI框架,但是用起来发现文档并不那么全面,但已经写好很多页面和功能了,因此只好继续摸索,其中包括日期选择器的初始值设置,起始结束年限的设置,timepicker默认选中的小时和分钟的初始值设置等;如下:1.效果:2.代码: 1).datepicker的HTML结构代码;2)data数据设置代码3).函数代码4).po...原创 2019-09-11 17:25:31 · 397 阅读 · 0 评论 -
移动项目中sessionStorage的简单使用和js拼接html页面的相关使用;
本次项目使用的是基于JQ的js技术,页面直接的数据传递采用了sessionStorage存储,根据后台返回的数组长度渲染页面,采用js拼接html方式,关注点有单选框的写法,点击本条数据的上下拉按钮,效果如图:项目最终实现效果GIF图1.登录后需要存储手机号和登录接口返回的产品数组,存储sessionStorage过程如下:数组不能直接存储进sessionStoragel里,需要用...原创 2019-09-06 09:48:50 · 260 阅读 · 0 评论 -
关于vue单页面应用访问路径添加项目名的设置步骤
我想要的访问路径效果如图:1.在index.html的头部中设置红框圈中的代码:2.在router.js中设置路由模式如下(设置history是为了去掉默认的#锚点):3.在vue.config.js中设置公共根路径如下:4.在开发和生产环境中设置默认基路径,防止首次进入页面未点击路由导航时不显示页面:如有更好的方法,请留言指教。谢主隆恩啦!...原创 2019-08-19 16:46:37 · 6288 阅读 · 3 评论 -
关于轮播图的灵活使用之swiper
我的业务需求如下:四张(以后会更多张)卡片一个版面展示三张,可滑动最开始我使用的是vant中自带的swiper组件,但是它仅支持一屏展示一个,我尝试写了内外层的循环,也实现了这种一屏展示三个卡片的效果,但是与后台拉到数据后,数据是一个大数组,要想和前端的页面四张卡片进行数据匹配上就需要对拉取的数据进行分层处理,这样得话也能实现功能和需求,但是一旦卡片数量的数据很多的话就会造成卡顿等响应缓...原创 2019-08-19 11:50:52 · 346 阅读 · 0 评论 -
已阅读并同意***协议的单选框制作注意事项------checkbox与radio的使用
一.我需要的效果是支付方式为多选一,只有一项时默认选中不可取消,服务协议是只有一项协议,可选中可不选中,不选中不可开通,效果如下:阅读并同意使用的是checkbox二,实现代码:单选radio是支付方式使用的,无论选项有一个还是多个,它都必须选中一项,不可以一项不选;服务协议是只有一个服务协议,用户可以同意可以不同意,需要有个选或者不选的过程,因此不能使用rad...原创 2019-08-19 11:22:23 · 5852 阅读 · 2 评论 -
使用$ref绑div节点获取样式改变的初始化样式相关注意事项
一.根据需求要实现的效果如下:每个权益对应相应进入效果,点击其它权益圈后改变二,在这里我使用了$ref绑到对应的div上,然后对其样式进行控制改变,但是进入页面时总显示$ref的changeStyle未定义,后来我查看了生命周期,我在created的时候调用肯定是不行的,因为那时候Dom还没完全生成,后来仔细查看后发现在mounted后系欸但和页面就已经渲染完成了,参考文章如下:...原创 2019-08-19 11:10:28 · 1216 阅读 · 0 评论 -
求教:vue-cli3创建项目后总是报错版本冲突问题,解决后并不知道为什么这么做就可以成功创建,想知道原理。
抽空记录一下负责移动项目后的第一个技术问题吧;因为需要使用cli3.0版本进行项目搭建,所以我卸载电脑里之前安装的vue-cli2.0版本后安装了vue-cli3,准备创建第一个项目试试效果,结果vue-cli3创建项目后总是报错版本冲突问题:Vue packages version mismatch: vue@2.5.17 (C:\Users\24194\node_modules\vue...原创 2019-07-18 14:13:03 · 1530 阅读 · 6 评论