- 博客(21)
- 收藏
- 关注
RSS订阅原创 数字滚动效果
function numAnimate(){ for(var i = 0;i <= 52;i ++){ numList.push(Math.round(Math.random())) } num_str = numList.join('') timer = setInterval(function(){ numList.shift(); numList.push(M.
2020-05-21 10:27:18
170
原创 vue中给data中的变量动态添加后缀
比如在data中声明的show1、show2、show3、show4，会有场景使用时是showX需要需要用到一个变量去赋值1、2、3、4…let index = 1/2/3/4this[`show${index}`]
2019-10-10 18:36:51
1247
原创 Vue点击事件获取当前元素html
想实现类似jquery里的$(this).html()这里需要用给click事件添加$event参数@click="buyProduct($event)"在methods里buyProduct方法接收参数buyProduct (event) { // event.target 当前点击的元素 // event.currentTarget 当前绑定事件的元素 // event.cu...
2019-10-10 18:28:44
2532
原创 数组对象中每个对象添加一个字段
将数组对象中每一个对象添加一个字段let arr = [ {name: 'lilei',age: '25'}, {name: 'nike',age: '23'}, {name: 'alisa',age: '23'}]使用Array map()方法map()方法将调用的数组的每个元素传递给指定的函数，并返回一个数组，它包含该函数的返回值，有三个参数1、curren...
2019-08-22 16:42:23
21623
1
原创 iframe解决高度自适应问题
项目中遇到页面内嵌iframe标签，接口请求到数据，将url赋给iframe，但是内容高度不定，试了很多方法，过程不述。以为iframe是跟cavans标签一样，要提前给定宽高，没法做到自适应高度的，而内容的高度提前不知道。最后发现是将iframe的style中属性scrolling设置为yes，这样内容可以滚动，有滚动条...
2019-07-22 18:21:41
198
原创 H5利用jsBridge与原生交互
给原生发消息，想在回调中判断回调的结果进行操作，结果发现安卓和IOS都收不到回调的返回值。分析是因为利用jsBridge给原生发消息是同步方法，调用即结束了，前端已经拿不到回调结果。可以在回调中做操作，但不能利用原生的返回值做 if 条件来判断。所以，还需要进行的处理是给原生发消息，原生在完成了必要的操作以后，再调用jsBridge给前端发一个消息，通知已经完成，再交由前端处理。先给原...
2019-07-16 15:39:28
2489
原创 vscode快速生成vue模板
1.需要一个插件来识别vue文件插件库中输入vuter，install下载2.设置自己的代码片段File - Preferences - User Snippets - 输入vue.json 建立以此命名的文件删除其中的代码3.修改其中的代码4.重启vscode，新建页面的时候输入vue，回车，快速生成vue模板...
2019-04-08 10:38:27
3562
原创 将字符串转化为数组对象
在做项目的时候后端传回的数据中，有个字段是以分号连接的字符串需要实现的效果所以这就需要将上面的一段字符串转化为一个数组对象，下面是实现代码this.detailInfo = res.datalet guide = res.data.guide.split('；') //res.data.guide为上述字符串guide.pop()var guideList = [...
2019-03-19 14:22:20
22425
原创 配置webpack的proxyTable实现跨域
原理：利用本地服务器的代理功能，类似于nginx的反向代理解决跨域问题大概配置如下assetsSubDirectory: '',assetsPublicPath: '/',proxyTable: { '/api': { target: '***********************', //源地址 changeOrigin: true, //改变源...
2019-03-19 13:26:37
526
原创 设置display:inline-block后内容为空和不为空 位置发生改变
将四个span标签设置diplay:inline-block，起始值都为空时，保持在同一水平位置这里的css如下，自己感觉完全不会有问题的span{ display: inline-block; width: 35px; height: 35px; color: #000000; line-height: 35px; mar...
2019-01-31 19:19:26
505
原创 将手机号中间四位变成*
在项目中我用的是正则的方法var mobile = '15620978384';var pattern = /(\d{3})(\d{4})(\d{4})/;mobile = mobile.replace(pattern, '$1' + '****' + '$3');总结两种字符串处理的方法一并写在这里1、substrvar mobile = '18810399133';m...
2018-12-21 09:52:28
557
原创 Flex 布局 几种常用形式汇总
1、不同的对齐方式，一种两端对齐，中间间隔相同；一种每个项目两侧间隔相同<div class="container-1"> <div class="item col-one-1"></div> <div class="item col-one-2"></div> <div class=
2018-11-29 18:40:42
570
原创 Element-Ui 按需引入以后 Message组件错误
项目完成后，进行性能优化，其中一项措施对Element-Ui采用按需引入的方式但是发现Message模块出现错误this.$message({ message: '正在开发', type: 'info', duration: 1000});这是组件的使用import { Dialog, Select,Progress,Message,Option } ...
2018-11-29 17:40:49
5812
原创 css3设置字体阴影
给文字加上阴影效果.text-shaw{ text-shadow: 0px 6px 1px #83ACDB;}效果阴影的偏移位置属性设置text-shadow: X-offset(X轴偏移量) Y-offset(Y轴偏移量) Blur(模糊半径) Color(颜色);...
2018-11-29 15:30:25
9681
原创 vue路由name同名，路由重复问题
在项目中，想让路由后缀为空，或者index的时候，都跳转到路由为index的页面，于是在router中如下配置routes: [{ path: '/', name: 'index', component: () => import('@/components/index').then(m => m.default) },{ path: '/in...
2018-11-21 10:17:46
10541
原创 汇总一些前端的数据处理方法（持续更新）
1.在字符串特定位置插入字符比如返回值 res = "20181016"，转化为"2018年10月16日"res = res.slice(0,4) + '年' + res.slice(4,6) + '月' + res.slice(6) + '日'2.返回数据由于某些原因无法完全转化为json，有些部分是一整个字符串，如下"results":[{"recordList":"[{s...
2018-11-19 15:22:37
2651
原创 H5与原生交互判断移动设备类型
跳转方法需要根据要跳转进入的设备传入不同的参数var u = navigator.userAgent, app = navigator.appVersion; var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器 var isiOS = !!u.matc...
2018-11-09 17:06:59
482
原创 Vue图片路径的处理
VUE图片路径绑定项目中由于后端返回的数据，不能直接得到图片路径地址，与后台定义了一下，将需要用到的图片存在本地，后端返回一个图片命名，根据名称取到相应的图片。<div class="fl img-left"><img class="img-response" :src="getImageUrl(item.taskImg)" alt=""></div&am
2018-11-06 11:09:00
2978
原创 css3动画性能优化
项目里运用的css动画，几片白云来回飘动，起初都用的定位，发现在安卓手机上展示，会有些掉帧似的抖动，很不流畅.cloud_2{ position: absolute; top: 150px; /*left: 20px;*/ width: 32px; -webkit-animation:movingTwo 3s linear infinite; ...
2018-11-01 10:40:54
611
原创 实现签到情况的历史信息展示
遇到一个需求，根据输入的年月查询展示签到天的高亮展示<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><style type="text/css"> *{ m
2018-11-01 10:24:48
742
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人