js
文章平均质量分 54
V_AYA_V
且就洞庭赊月色,将船买酒白云边
展开
-
函数高阶-柯里化实现
在数学和计算机科学中,柯里化是一种将使用多个参数的函数转换成一系列使用一个参数的函数,并且返回接受余下的参数而且返回结果的新函数的技术。原创 2022-06-27 15:16:45 · 155 阅读 · 0 评论 -
H5页面在IOS微信webview中无法校验视频文件时长问题
H5页面在IOS微信webview中无法校验视频文件时长问题原创 2022-05-10 11:15:03 · 857 阅读 · 1 评论 -
使用七牛云上传时压缩图片不触发complete
使用七牛云上传时压缩图片不触发complete原创 2022-04-26 17:25:13 · 1433 阅读 · 1 评论 -
你不知道的JavaScript上卷-this和对象原型
关于thisthis即不指向函数自身也不指向函数的词法作用域不要妄图使用this来引用一个词法作用域内部的东西。也就是说无法实现this与词法作用域的查找混合使用。function foo() { var a = 2; this.bar(); }function bar() { console.log( this.a ); }foo(); // ReferenceError: a is not definedthis到底是什么?this的绑定与声明和函数声明的位置没有任何关系,只原创 2022-01-04 11:18:28 · 263 阅读 · 0 评论 -
你不知道的JavaScript上卷-作用域和闭包
1. LHS引用与RHS引用的区别:RHS:取到源值-得到某某的值LHS:谁是赋值操作的源头-给谁赋值function foo(a) { var b = a; return a + b; }var c = foo( 2 );// 所有LHS查询:a=...(形参隐式赋值)/b=.../c=...// 所有RHS查询:foo(2)/=a/a+/+b2. 作用域是什么?作用域是一套规则,用于确定在何处以及如何查找变量(标识符)。3. 词法作用域:词法作用域就是在定义词法阶段产生的作用原创 2021-12-08 16:09:54 · 535 阅读 · 0 评论 -
如何将埋点信息在页面关闭之前发送出去?
公司自己搭建的数据监控后台系统,旨在统计一些前端应用的用户行为。为了不添加过多的请求压力,前端会定时将用户行为数据发送,这样会遇到一个问题,当行为数据栈里面有数据,没有在规定周期发出的时候关闭页面,会导致部分数据不能成功发出。遂想到添加如下代码:window.onbeforeunload = () => { // 请求后端数据,参数省略 Api.send({...})}查阅资料又接触到了beforeunload、unload、pagehide 和 visibilitychange这.原创 2021-08-17 14:20:21 · 1530 阅读 · 0 评论 -
vue使用Echarts定制散点图及mock数据的使用实践
项目数据分析需要是用散点图,但是在官网展示的案例中没有产品想要的效果,所以花了一点时间定制散点图,另外由于散点图的数据要多一些才比较直观,所以使用了mock生成假数据为了方便后面与后台对接,首先确定了数据结构(可以按照自己喜欢的结构自行构建)[ { time: 6, rate: 90, name: 'Mick' } ...]定制1:tooltip展示除散点标记数值之外的数据。tooltip: { trigger: 'item', formatte.原创 2021-03-08 17:33:42 · 565 阅读 · 0 评论 -
js工具-cookie简单封装
简单封装一下cookie的一些操作方法。/** * @desc 根据key读取cookie * @param {String} key * @return {String} cookie */function getCookie(key) { const arr = document.cookie.replace(/\s/g, '').split(';') for (let i = 0; i < arr.length; i++) { const tempArr = a.原创 2021-03-01 14:35:22 · 119 阅读 · 0 评论 -
vue使用keep-alive实现页面缓存
最近遇到一需求,从一个看板页面跳转到其他页面之后再回到看板页面,需要定位到跳转之前的位置。主要用到了vue的keep-alive,功能整体实现难度不大,但是总结一下实现过程中遇到的一些问题。1.keep-alive简介官网传送门2.路由修改为了区别不同路由的缓存与否,在路由配置中meta添加keepAlive字段,修改App.vue//router.js{ path: '/xxx', name: 'xxx', component: ()=>{} meta: { .原创 2021-02-23 17:55:44 · 407 阅读 · 0 评论 -
js实现页面或DOM元素平滑滚动
在前端开发页面的工作中,经常会遇到点击导航栏页面滚动到某一指定区域的需求,直接使用window.scroll或者window.scrollTo方法可以实现该需求,但是现实场景中我们希望滚动更加平滑,并且我们希望不仅仅是window能滚动,在某一个设置了overflow-y:scroll属性的div中也能滚动到某一位置。在此,我们以在vue中的实际场景为例:1.window.requestAnimationFrame()window.requestAnimationFrame() 告诉浏览器——你希望.原创 2020-12-29 09:38:15 · 2034 阅读 · 0 评论 -
vue中使用lodash方式及webpack配置优化
最近vue项目中有很多操作数据的需求,考虑到lodash功能之强大,决定在项目中使用一下。1.安装lodashcnpm i lodash -S npm i lodash -S --registry=https://registry.npm.taobao.org2.引入//全局引入,在main.js中:let _ = require('lodash')Vue.prototype._ = _ //全局挂载lodash//按需引入let _fun= require('lodash/fun'.原创 2020-12-22 16:32:56 · 2057 阅读 · 0 评论 -
iframe与父容器之间通信postMessage实践
近期一项目有需求在祖传代码上加一个全新的功能模块。该功能模块主要功能都靠通信完成。因此想到了直接使用iframe嵌入祖传项目。新模块使用的是vue全家桶,本文内容主要涉及到iframe与祖传代码的通信与数据共享的一些问题总结。postMessage是什么正确使用window.postMessage() 方法可以安全地实现跨源通信。通常一个窗口可以获得对另一个窗口的引用(比如 targetWindow =window.opener),然后在窗口上调用 targetWindow.postMessage.原创 2020-11-24 11:25:24 · 592 阅读 · 0 评论 -
$.ajax获取后台动态生成xlsx文件
需求:后台根据前端传递的参数动态生成xlsx文件模板,提供给前端下载。前端点击按钮下载文件。下载函数:function downloadFile(){ const downLoadhref = `api/xxxxxxxxxxxxxxxx` const a = document.createElement("a"); a.download = '文件模板'; a.style.display = "none"; a.href = downLoadhref; document.body.app.原创 2020-11-11 11:17:46 · 227 阅读 · 0 评论 -
vue中使用Echarts实践
最近有项目需求实现一个简单的柱形统计图,涉及到的数据不是很复杂,但是交互效果需要美观!!!首先就想到了Echarts,毕竟使用简单,功能强大,很香!第一步:安装最新Echarts,安装教程见官方教程。npm install --save-dev echarts --registry=https://registry.npm.taobao.org第二步:按需引入(建议使用,Echarts包很大)// 注意一定使用require!!!let echarts = require('echarts/.原创 2020-11-10 09:50:36 · 165 阅读 · 2 评论 -
vue中使用websocket实践
问题描述:最近有项目涉及到前后端websocket通信,在封装好了websocket相关的方法后,需要在onmessage里面拿到后端的返回信息。也看了网上很多实例,大部分都是直接在.vue文件里面去初始化websocket,考虑到自己项目的实际情况决定将websocket的一些方法抽离出来,方便复用。这里记录一下onmessage事件的处理import { websocketConfig } from '../config'let ws = null;let heartBeatTimer = n.原创 2020-10-27 18:28:33 · 1258 阅读 · 0 评论 -
vue中使用element-ui文件上传组件实践
本实例以上传.xls,.xlsx文件为例,其它文件上传方法思想同此,可以封装一个上传文件的组件。本实例涉及到的js,css文件可以CDN引入,也可直接下载官方最新版本到本地。//优先引入css,否则页面会闪动<link rel="stylesheet" href="/src/common/css/element.css" /><div id="main-container"> <el-upload class="upload-demo" .原创 2020-10-17 09:29:02 · 262 阅读 · 1 评论 -
js复制文本到粘贴板实现方法
copy.js文件export default input => { const el = document.createElement('textarea') el.value = input el.setAttribute('readonly', '') el.style.contain = 'strict' el.style.position = 'absolute' el.style.left = '-9999px' el.style.fontSize = '.原创 2020-09-09 17:37:37 · 224 阅读 · 0 评论