- 博客(15)
- 收藏
- 关注
原创 模拟淘宝/支付宝——实现tab栏左右拖动,进度条同步滑动距离
01需求简单效果图02 代码htmljsLAST 监听事件附上代码: // 导航栏滑动 slide () { let that = this let left = this.$refs.navTabItems.scrollLeft // 导航栏向左滑动的距离 that.scrollLeft = left...
2019-12-06 15:14:37 577 1
原创 Vue —— 面试相关记录(一)
一. vue-router 两种模式的区别?核心答案:vue-router 有 3 种路由模式:hash、history、abstract。hash模式:hash + hashChange特点:hash虽然在URL中,但不被包括在HTTP请求中;用来指导浏览器动作,对服务端安全无用,hash不会重加载页面。通过监听 hash(#)的变化来执行js代码 从而实现 页面的改变。核心代码:window.addEventListener(‘hashchange‘,function(){self.u
2021-12-01 10:13:42 345
原创 css3实现tab切换动效
实现效果如图2. 代码 <div class="accoradion"> <input type="radio" id="collapse1" name="tap-input" hidden /> <input type="radio" id="collapse2" name="tap-input" hidden /> <input type="radio" id="collapse3" name="tap-input" hidde.
2021-03-03 15:04:29 739 1
原创 在线/离线 监听事件
window.addEventListener(“online”, function(){}); // 声明(在线)监听事件window.addEventListener(“offline”, function(){}); // 声明(离线)监听事件
2021-01-13 11:10:18 193
原创 数组去重——reduce
let array = [1, 1, 5, 6, 7, 6, 7] let newArr = array.reduce(function(pre, cur){ if(!pre.includes(cur)){ return pre.concat(cur) } else { return pre; } },[]) console.log("newArr", newArr);// arr.reduce(callba.
2020-12-25 11:26:09 114
原创 ios——Input框失焦时 页面出现点不动的问题
ios上使用input框调起系统键盘后 页面会因键盘挤压而上滑,键盘收起后,页面实际上未回弹的问题…解决:在input失焦时,强制回弹。setTimeout(() => { let scrollHeight = document.documentElement.scrollTop || document.body.scrollTop || 0 window.scrollTo(0, Math.max(scrollHeight - 1, 0)) }, 10
2020-08-10 14:10:30 349
原创 echarts------添加走势区域渐变色
series: [areaStyle: { // 渐变色 color: new echarts.graphic.LinearGradient( 0, 0, 0, 1, [ { offset: 0, color: 'rgba(48,159,234,0.30)' }, { offset: 0.5, color: 'rgba(48,159,234
2020-07-16 18:20:31 301
原创 echarts-------添加百分位线
series: [{// markLine: { // 添加百分位线// symbol: ‘none’,// data: [// {// name: ‘40百分位’, //// silent: true, // 鼠标悬停事件// lineStyle: {// type: ‘solid’,// color: ‘#A271FF’// },// yAxis: chartData.wa
2020-07-16 18:18:06 349
原创 移动端rem布局——初始化html, fontSize
自执行函数:window.onresize = function(){ +function(){ var deviceWidth = document.documentElement.clientWidth; if(deviceWidth > 750) deviceWidth = 750; document.documentElement.style.fontSize...
2019-12-23 15:49:55 236
原创 Echarts——获取动态数据 页面没渲染出来(vue)
01 问题接口获取的数据已经成功赋值(可打印) 但没有渲染到页面02 解决使用watch深度监听改变的值 watch: { chartDataFa: { handler (newVal, oldVal) { if (this.oChart) { if (newVal) { getChart.showChart....
2019-12-10 13:52:30 2676
原创 Echarts——markLine 折线图之添加百分位线
01 代码series: [{markLine: { // 添加百分位线symbol: ‘none’,data: [{name: ‘40百分位’,silent: true, // 鼠标悬停事件lineStyle: {type: ‘solid’,color: ‘#f40’},yAxis: chartData.warnNum // 接口返回的数据1...
2019-12-06 14:37:45 1284
原创 123
试一下–2019-08-26发个博客试一下啊你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。新的改变我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:全新的界面设计 ,将会...
2019-08-26 15:31:57 85
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人