王2疼-CSDN博客

原创项目中的一些疑难杂记

如果你在一个函数中多次使用同一个正则表达式，而这个正则表达式具有全局标志（g），那么在每次调用函数时，匹配状态都会从上一次的位置继续。直到有一天，测试同学提了个 bug 单，然后就开始排查，debug 发现第二次调用引入正则变量的函数时，正则未生效，奇了怪了…lastIndex 属性：最后一个索引，总是指向下一次查找开始的地方，正则表达式开始下一次查找的索引位置，第一次为0。因页面中多个函数使用到同一个正则表达式，想着定义个变量 export 出去然后在对应的函数中引用，一切正常中…

2024-02-12 22:29:22 274

原创关于前端如何下载后端接口返回content-type为application/octet-stream的文件

后端接口定义为直接返回一个文件，如果带认证信息可以直接通过浏览器url下载，但是接口需要传headers认证信息，url上又不支持传相关信息。

2023-10-24 16:32:54 2985

原创 React 组件中无法清除定时器问题记录

网上查询之后了解到：清除定时器，定时器的标识会在一瞬间变为 undefined , 但立马就会又重新开始执行定时器，而且定时器标识不变。clearTimeout发现清除不掉，就在清除定时器的前后分别打印了一下timer，发现log出来的全都是undefined。函数组件的本质是一个函数，而在在一个局部函数中，函数每一次执行，都会在把函数的变量重新生成一次。可将定时器放入state中，感兴趣的可以自己测试下。关闭弹窗时，需要把页面透传到组件中的定时器清除掉。将定时器变量定义在函数组件外部（全局）

2023-10-24 16:01:06 598

原创 input 标签调起摄像头拍摄并预览（移动端）

html部分<input type="file" id="file1" accept="image/*" capture="camera" @change="changePic" />js部分changePic(e) { // console.log(e) const _this = this; const fileObj = e.target; const file

2021-03-04 15:47:33 2621 1

原创 img元素的object-fit属性

2021-01-04 12:20:31 2306

原创 Highcharts 数据可视化常用图表

Highcharts 各类图表展示1、正常曲线图chartOptions: { chart: { zoomType: "x", // x轴可伸缩 height: 268 }, xAxis: { type: "datetime", // 以日期格式展示 showLastLabel: true, lineColor: '#F8F8F8', tickColor: '#F8F8F8', plotBands: { // 标示区 from: 1399305600

2020-12-31 17:28:20 690

原创 vue项目中微信h5页面跳转到小程序 wx-open-launch-weapp

先放上微信官方文档：微信官方文档1、先请求接口配置微信需要的一些参数// 需要先请求后端接口 let url = window.location.href.split("#")[0];let shareConfig = await shareViewAPI.getWechatConfig({url});let _this = this;// 将接口返回的信息配置 wx.config({ debug: false, appId: _this.app_id, // 必填，公众号的唯一标

2020-08-25 13:01:27 3525 12

原创 vue 播放器插件 vue-video-player 播放流文件

git项目地址：https://github.com/surmon-china/vue-video-player1、安装插件npm install vue-video-player videojs-contrib-hls -S 2、引入插件在main.js中引入import VideoPlayer from 'vue-video-player'require('vue-video-player/node_modules/video.js/dist/video-js.css')require(

2020-08-12 17:57:24 1409

原创 element-ui 的table无限加载更多 infinite-scroll

// 此指令依赖于 element-ui1 安装npm install el-table-infinite-scroll -S2 引入全局引入import Vue from 'vue';import elTableInfiniteScroll from 'el-table-infinite-scroll';Vue.use(elTableInfiniteScroll);局部引入import elTableInfiniteScroll from 'el-table-infinite-scr

2020-07-21 13:18:13 4488 2

原创 vue-router 懒加载报错 Loading chunk {n} failed

懒加载懒加载：避免单页面应用一次性加载全部组件造成加载时间过长。使用：// router文件中routes: [{ path: '/Login', name: 'Login', component: resolve => require(['@/views/Login'], resolve)}...]跳转或加载路由时报错 Loading chunk {n} failed使用懒加载会经常导致导航点击没用，加载模块出现错误解决：在当前文件中加入vue-routerrou

2020-07-01 00:23:50 1378 1

原创实现一个函数的链式调用

实现一个LazyPig，可以按照以下方式调用:/* LazyPig(“Peggy”)输出:Hello，I’m Peggy！LazyPig("Peggy").sleep(10).eat("dinner")输出Hello，I'm Peggy！//等待10秒..Wake up after 10Eat dinner~LazyPig("Peggy").eat("dinner").eat("supper")输出Hello，I'm Peggy！Eat dinner~Eat supper~以此类

2020-06-06 10:02:57 827

原创前端开发面试过程中遇到的编程面试题

输出下面代码的结果var a = b = {x: 1};var a.x = a = {x: 1};console.log(a); // {x: 1}console.log(b); // {x: {x: 1}}用js判断一个字符串是否是回文字符串// 1 使用reverse()方法// 2 for循环判断//方法1function palind1(str) { let newStr = str.toLowerCase(); for(let i=0,len=Math.floor(.

2020-05-25 22:23:25 199

原创如何创建ajax

如何创建ajax1 创建一个XMLHttpRequest对象（异步调用对象var xhr = null;if(window.XMLHttpRequest){ xhr = new XMLHttpRequest()}else { xhr = new ActiveXObject("Microsoft.XMLHTTP")}或var xhr = null;try { xhr = n...

2020-04-18 10:39:13 187

原创 vue配置px2rem适配移动端（自动将px转rem）vue-cli2 版本

vue配置px2rem1 安装npm install px2rem-loader lib-flexible –save2 在项目入口文件main.js中引入lib-flexibleimport 'lib-flexible/flexible'3 在build下的 utils.js中为generateLoaders 添加 px2remLoaderconst px2remLoader =...

2020-04-11 09:25:03 704

原创 Uni-app 实现离线打包安卓篇

Uni-app 实现离线打包安卓篇1. 安装相关工具及下载文件1) Android studio2) Hbuilder官方SDK2. Android本地打包1) 解压官方sdk，内容如下图：2) 使用Android Studio作为项目打开Hbuilder-Hello3) 切换为项目视图，选中如下文件夹4) 右键该文件夹，点击show in Explorer，弹出该目录的文件视图，如下5) 返回...

2019-12-12 14:18:26 710

原创 vue 父子页面相互传值

1、首先在main.js中添加如下代码：Vue.prototype.$eventHub = new Vue();2、父页面进入子页面及传参代码：3、子页面接收父页面传来的值onLoad(opt) { //opt是传过来的queryString对象 this.param = opt.id;}4、子页面向父页面传值...

2019-10-25 14:19:58 558

原创将本地项目上传到码云上

1、首先在码云上新建一个项目获取项目地址2、本地新建一个文件夹并进入新建的文件夹，点击鼠标右键，选择git bash here然后在窗口输入 git init 这时候文件夹会多出一个.git文件夹3、进入刚刚在码云新建的项目里，复制框框里的路径4、继续操作git 输入git remote add origin + 在码云复制的那行路径5、继续输入 git pull origi...

2019-08-30 17:56:32 161

原创给自己俩嘴巴子

1、TypeError: Converting circular structure to JSON at JSON.stringify这个错误真的是，痛心疾首啊=.=浏览器报错说请求接口的时候catch到的错误，然后就去查axios文件，查不出来个所以然来，然后就去百度，百度说是forEach的时候出错，然后懵，因为并没有用到forEach，再查，直到我看到这个哇，然后就赶紧去页面查看请...

2019-05-23 10:07:32 186

原创 vue项目中接入百度地图api

vue项目中接入百度地图api1、申请百度地图秘钥申请地址： http://lbsyun.baidu.com/apiconsole/key2、安装插件$ npm install vue-baidu-map --save3、 main.js中引用vue-baidu-map组件import Vue from 'vue';import BaiduMap from 'vue-baidu-m...

2019-04-17 17:09:50 3681 4

原创用 vue + iview写项目遇到的一些问题

用iview写项目遇到的一些问题1、menu导航手动展开制定的子菜单功能快捷键1、menu导航手动展开制定的子菜单在此处先自定义了一个变量数组 openedNames最开始想的是监听route路径，路径变化时，改变openedNames值，值是改变了，但是并没有按照name值来展开对应的子菜单。查看文档，发现有个方法updateOpened，就直接写上去了，还是无效。最后的解决办法如下：...

2019-03-18 12:16:26 1806

原创记 js 在 android 和 ios 端的一些兼容

清除transition闪屏-webkit-transform-style: preserve-3d;-webkit-backface-visibility: hidden;audio和video元素在两端无法自动播放$('html').one('touchstart',function(){ audio.play();})ios6下伪类:hover(除a标签之外的元素...

2019-01-29 13:37:55 436

原创 CSS碎片小知识

CSS碎片小知识块元素内两端对齐div { display: flex; justify-content: space-between;}① 当该块元素里面只有一个行内元素时，居左显示；② 当该块元素里面有两个行内元素时，两端对齐；③ 当该块元素里面有三个行内元素时，两端对齐且中间的居中显示；...

2019-01-08 22:01:27 170

原创 Vue 学习过程中遇到的一些问题

Vue 学习过程中遇到的一些问题webpack安装失败解决：方法有点笨，但实用，我是卸载node，重新安装哈哈哈，刚开始只是自己删除了node的一个文件夹，但好像没什么用第二次在网上查了查，说是要把之前设置的关于node的环境变量什么的都得删掉（记得不可全部删除，只删除node部分的），又把报错提醒的一些文件夹里的所有关于node的文件都删除干净了，接着找到了当时下载的node安装包，...

2019-01-04 13:31:43 611 1

原创 js 各种碎片小知识

获取包含某个属性的元素$('img[name=&amp;amp;amp;quot;dog&amp;amp;amp;quot;]')获取不包含某个class的元素$('p:not(.hide)')delay()方法：将程序暂停一段时间$(&amp;amp;amp;quot;div&amp;amp;amp;quot;).delay(1000).hide();//1s之后隐藏div元素index()方法：获取元素的下标

2019-01-03 15:44:16 205

原创 css 解决文本溢出问题

单行文本溢出字数过多超过盒子时，以"…"形式显示p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; /* 不换行设置如何处理元素内的空白*/}text-overflow 规定当文本溢出包含元素时发生的事情：值为clip 表示修剪文本值为ellipsis 表示以省略号显示值为" " 表示以...

2019-01-03 14:55:22 318

原创 js 获取地址栏参数的两种方法以及window的一些常见用法

js 获取地址栏参数的两种方法1. 传统方法获取：function getParas(){ var href = location.href.split("?")[1]; var paras = href.includes("&") ? href.split("&") : href; //判断是一组还是多组key:value var arr = []; for(var...

2019-01-03 14:37:08 614

原创 js 关于选择框的选中取值问题

js 关于选择框的选中取值问题获取按钮元素获取全部复选框$('input[type="checkbox"]')选中按钮$("#bt").attr("checked",true);//true等同于"checked"$("#bt").prop("checked",true);/

2019-01-03 13:54:00 823

原创 js 实现简单的星星值打分

此实例只能实现简单的0-5整数值打分直接po代码：<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title&g

2019-01-03 10:36:50 972

原创 js时间日期与时间戳的相互转换

js时间日期与时间戳的相互转换前端与后台交互时经常会需要转换时间戳，或许你可以让后台帮你转换，但是自己掌握这点小技能还是挺好的哈哈。将日期转换为时间戳格式将当前日期转换为时间戳格式var now = new Date().getTime();console.log(now);//1546421299492将指定日期转换为时间戳格式var ttime = new Dat...

2019-01-02 17:31:32 428

转载 H5调用移动端手机摄像头

H5调用移动端手机摄像头capture表示，可以捕获到系统默认的设备，比如：camera照相机；camcorder摄像机；microphone录音。accept表示，直接打开系统文件目录。<label> 照相机: <input type="file" id='image' accept="image/*" capture='camera' multiple>&lt...

2019-01-02 16:53:34 3248 3

转载前端人员从photoshop中获取css代码的方法

转自https://blog.csdn.net/xiaoermingn/article/details/53244117很多时候拿到设计图的时候，如果UI没有给配色、字体大小什么的说明文件，这时就需要我们自己去取，传统的方法是在photoshop中取色、量取像素大小之类的，在photoshop cc 中为我们提供了自动提取css的方法，下面就为大家介绍这种方法。psd练习文件http:/...

2019-01-02 16:33:15 564

原创 js 解决安卓端软键盘遮挡文本框的方法

js 安卓端软键盘遮挡文本框的解决方法在工作中需要写h5页面供给安卓和ios开发使用，所以会遇到各种不兼容的问题点击文本框输入东西时，ios端文本框会正常弹出到软键盘之后，但是安卓端的文本框就会还在原处，软键盘弹出后就会遮挡文本框有在网上查询解决方法，但是客户端用我的页面的时候方法没有生效，所以最后就手动弹起文本框来解决解决方法没有影响ios端的正常效果PO上代码：$("#inputV...

2018-12-29 14:35:07 812

原创 js 获取元素的html代码

js 获取元素的html代码//html代码<p id="el">Gotcha！</p>//js代码var ccc = $("#el").prop("outerHTML");console.log(ccc);//<p id="el">Gotcha！</p>

2018-12-29 14:20:14 5518 8

原创 js 判断字符串中是否包含某个字符串

js 判断字符串中是否包含某个字符串#1 indexOf方法//str.indexOf("")的值为-1时表示不包含var str = "hello Tara";if(str.indexOf("Tara") !== -1){ alert("Hi,Tara");}#2 includes方法//str.includes("&q

2018-12-29 14:15:53 109834

原创 js 上传图片并转为base64编码+预览图片+压缩实例

js 上传图片并转为base64编码+压缩并上传html部分&amp;amp;lt;div id=&amp;quot;adds&amp;quot; class=&amp;quot;fix&amp;quot;&amp;amp;gt; &amp;amp;lt;form id=&amp;quot;myForm&amp;quot; class=&amp

2018-12-29 13:09:08 1218

原创创建一个Vue项目的完整步骤

创建一个Vue项目的完整步骤一、安装node、npm1 下载链接：node下载下载完毕后安装node，可以一直点击下一步，npm会随着node安装也安装上，环境变量也会自动配置2 验证是否安装成功window+R 输入cmd打开命令窗口输入命令node -v npm-v 显示版本号后则表示安装成功二、配置全局环境window+R 输入cmd打开命令窗口在命令窗口中输入命令npm ...

2018-12-29 11:24:12 2285

原创 js实时监控文本框内容变化

js实时监控文本框变化$(&quot;input&quot;).bind(&quot;input propertychange&quot;,function(){ });简单小实例&amp;lt;!DOCTYPE html&amp;gt;&amp;lt;html&amp;gt;&amp;lt;head&amp;gt; &am

2018-12-29 10:24:02 1375

原创点击图片查看大图，让大图居中显示

点击图片查看大图，让大图居中显示需求：因为图片大小不一，有的图片比较长，一般的居中方法会使大图被截掉//html部分&lt;div class="isImg"&gt; &lt;img src="https://avatar.csdn.net/5/F/2/3_weixin_39228870.jpg"/&gt;&lt;/div&gt;

2018-12-28 17:23:36 793

原创点击除el元素之外的地方，隐藏该el元素

点击除el元素之外的地方，隐藏该el元素需求：点击$("#dos")显示tab栏，点击body除了tab栏的其他地方，隐藏tab栏$("#dos").click(function(){ $("#tabs").show("slow");});$(document).bind('click', function(e) { var e = e || window.event; //浏览器兼容...

2018-12-28 17:04:45 228

空空如也

空空如也