Geek码农-CSDN博客

原创 js控制并发数量

class TaskQueue{ constructor(list,limit){ this._runList = []; this._taskList = [].concat(list); this.limit = limit; this.runTask(); } runTask(){ while(this.limit --){ this.addTask(this._taskLi

2021-10-20 18:00:26 518

承接上一篇文章一、clean-webpack-plugin配置webpack.config.js；用于清除输入文件夹的内容。新增// 清除目录内容const cleanWebpackPlugin = require('clean-webpack-plugin');~plugins:[ ~ new cleanWebpackPlugin() ]安装依赖npm i clean-webpack-plugin@2.0.2 -D可以在dist中新建个测试文

2021-07-16 11:20:48 225

原创 webpack@4.x（学习笔记01）

资料：webpack一、安装1、全局安装npm install --global webpack2、局部安装（案例使用中）创建个新的文件夹命名webpack01,在命令窗口打开初始化文件夹npm init -y//或者npm init//前者需要手动确认package.json中的各种描述，关于package.json这里不深描述了//成功后文件夹下有一个package.json文件局部安装webpackwebpack4.x版本需要另外安装webpack-clinp

2021-07-14 15:37:50 469

原创微信小程序/uniapp使用canvas绘制文本结构生成图片

结构宽高为自定义内容<canvas canvas-id="html2Img" :style="'height:'+ height +'px;width:'+ width +'px'"></canvas>~~~ data(){ return{ secondValue:10, gonext:false, canvasHidden:true, width:375,

2021-06-29 15:18:48 1149 3

原创 vue自定义组件v-model

功能实现在自定义组件上实现v-model双向绑定vue2.x子组件 <input type="text" :value="value" @input="valueChange"></template><script>export default { name:'inputDome', props:{ value:{ type:String, default:""

2021-06-24 13:43:31 119

原创 vue2中使用typescript的实现

这里使用的是vue2脚手架搭建vue项目，然后再手动改动文件使用ts；vue3脚手架可以自动生成ts开发环境一、新建vue项目vue init webpack vuets二、配置webpack修改build 文件下的webpack.base.conf.js//修改内容 resolve: { extensions: ['.js', '.vue', '.json', '.ts', '.tsx'], alias: { 'vue$': 'vue/dist/vue.esm.

2021-05-07 17:52:36 1655 2

原创 for(in/of)/forEarch的区别和使用

一、for in遍历数组输出索引const arr = [ { 'name':1 },{ 'name':2 },{ 'name':3 }]for(index in arr){ console.log(index)}// 输出0 1 2遍历对象输出对象属性，包含原型链上的属性，可以使用hasOwnProperty方法过滤掉原型链上的属性const obj = { 'name':'张

2021-04-25 14:32:05 422

原创 webpack5提取css文件

一、问题webpack5 extract-text-webpack-plugin使用报错二、解决办法mini-css-extract-plugin安装npm i mini-css-extract-plugin -D// 引入路径const path = require('path');// 打包htmlconst HtmlWebpackPlugin = require('html-webpack-plugin');// 提取css文件// const ExtractTextWebp

2021-04-13 11:00:56 617

原创 webpack5.x使用webpack-dev-server

版本 "webpack": "^5.27.2", "webpack-cli": "^4.5.0", "webpack-dev-server": "^3.11.2"报错npx webpack-dev-serverError: Cannot find module ‘webpack-cli/bin/config-yargs’webpack serve[webpack-cli] For using ‘serve’ command you need to install: ‘webp

2021-03-25 22:31:01 3609 1

原创 vue中使用mockjs

一、安装1、npm install mockjs -S2、二次封装axios（与mockjs无关），便于使用二、设置mockjssrc新建文件家mock，mock下新建index.jsimport Mock from 'mockjs'const templete={ "string|1-10": "知识图谱"}Mock.mock('/mock/data',templete);三、引入在main.js中引入require('./mock/index.js')四、调用

2021-03-02 17:18:10 225

原创前端基础入门知识记录

一、浏览器五大主流浏览器Internet Explorer浏览器（IE）IE内核：TridentIE渲染引擎：TridentIEjs引擎：Chakra微软公司旗下新的Edge浏览器将从EdgeHTML内核迁移为Chromium内核，同时还会登陆到Windows 7/8/8.1和macOS平台。OperaOpera内核： Presto跨平台浏览器可以在Windows、Mac和Linux三个操作系统平台上运行360和昆仑万维收购了Oprea浏览器，丢弃了强大的Presto内核，改用

2021-02-26 14:52:39 128

原创 Yapi 配置 pm2服务

全局安装 pm2npm install pm2 -g配置pm2服务pm2 start D:\YApi\my-yapi\vendors\server\app.js --name Yapi以Yapi的名称命名并启动常用命令pm2 start Yapipm2 stop Yapi

2020-12-05 10:58:47 2771

原创服务端下的mongodb安装配置以及外网连接

一、安装1、本地下载mongodb的linux版本安装包2、利用FTP工具把压缩包拿到linux中3、解压并重命名解压 tar -zxvf mongodb-linux-x86_64-amazon-latest.tgz 重命名mv mongodb-linux-x86_64-amazon-4.9.0-alpha-843-gc88795a mongoDB二、配置文件1、创建文件夹data、logs、etcmkdir datamkdir logsmkdir etc2、进入etc文件夹

2020-12-04 11:05:05 2992

原创阿里云服务器配置node环境

一、使用NVM安装多版本NVM（Node Version Manager）是Node.js的版本管理软件，可以轻松在Node.js各个版本间进行切换。适用于长期做node开发的人员或有快速更新node版本、快速切换node版本的场景。使用git将源码克隆到本地的~/.nvm目录下，并检查最新版本。yum install gitgit clone https://github.com/cnpm/nvm.git ~/.nvm && cd ~/.nvm && git c

2020-12-04 09:44:03 548

原创 window与linux搭建nginx服务——入门笔记

win10本地尝试首先下载nginx，官网下载这里选择的稳定版本本地新建个文件夹，解压出来在nginx路径下打开cmd启动服务相关命令启动:start nginx (nginx.exe目录下)关闭：nginx -s stop查看：tasklist /fi "imagename eq nginx.exe"关闭所有：taskkill /f /t /im nginx.exe相关说明conf目录下的nginx.conf，可以通过这里修改端口号，访问文件linux下载

2020-12-03 14:38:27 177

原创 node express 下开发token功能生成与验证

功能描述功能主要为服务的如何生成token,如何验证token;express下主要使用JWT方式。原生的jsonwebtoken 与 expressJwt两种方式的简单实现一、jsonwebtoken + expressJwt安装npm install express-jwt --savenpm install jsonwebtoken --save生成tokenUtil.secret,tokenUtil.expiresIn为公共文件定义的变量，便于后期维护//引入var jwt

2020-11-24 11:42:27 804 1

原创微信自定义分享ios无效

微信自定义分享无效情况有很多种，这里记录开发中遇到的一种分享链接包含汉字在自定义分享中，分享链接包含汉字，且没有进行编码处理，会导致ios无效；因为Android会自行进行处理，ios却不会，导致自定义分享内容失效。使用encodeURI(link)对需要分享的链接进行处理。例如下图：...

2020-10-15 22:45:29 882

原创 mongodb下载速度配置host

一、下载mongodb安装包官网下载速度慢，配置host文件方法一：打开cmd ,ping一下需要下载的域名，获取ip地址方法二：网上找DNS查询工具修改host文件在最后添加例如：13.225.176.115 fastdl.mongodb.org65.9.42.35 downloads.mongodb.comWIN10刷新DNS缓存Win+R->cmd->ipconfig /flushdnsDNS需要自己查询得到，配置完成后再下载速度会达到几百k...

2020-10-13 22:38:07 530

原创按钮变形闪烁效果css特效

结构示例小程序代码<view class="goodShow"> <button>精彩活动</button> </view>css.goodShow button{ animation: myAnimation 5s infinite; background: gainsboro;}@keyframes myAnimation{ 0%{ transform: scale(1) } 25%{ tran

2020-09-11 09:19:50 861

原创 html2canvas生成数据为“data:,“

原因页面处于隐藏状态，无法获取到对应的元素。解决办法在页面显示状态生成base64数据，然后再隐藏页面。

2020-07-20 19:12:05 1296

原创原生标签事件中调用angular方法$scope

原生标签事件onchange、onerror修改方式<img src="" οnerrοr="angular.element(this).scope.function()">$scope.function = function(){//}

2020-05-11 15:51:56 327

原创移动端pdf展示预览

引用文件pdfh5链接1、css<link rel="stylesheet" type="text/css" href="css/pdfh5.css"/>2、html<div id="pdf"></div>3、js<script src="./js/jquery-3.4.1.min.js" type="text/javascript"&g...

2020-04-13 15:14:44 1845

原创组件化开发中的mui-switch不起作用

mui('.mui-switch')['switch']();这个方法是属于mui.js里的，负责对switch组件初始化。在页面载入后，mui.js的switch部分会对包含有.mui-switch类的元素进行查找，验证其是switch组件结构后，对其进行初始化。而动态处理的switch组件结构，是没有经过上面的初始化的，所以不能用。就需要手动调用上面提到的这个方法进行初始化了。...

2020-03-19 11:59:41 632

原创 html2Canvas生成图片可视区域，其余部分缺失

基础使用html2canvas(document.body).then(function(canvas) { // url = canvas.toDataURL("image/png"); //url = canvas.toDataURL("image/*"); document.body.appendChild(canvas);});html2canvas(document....

2019-12-11 16:28:58 3275

原创修改网关路由，电脑同时连接内外网两个网络

查询路由信息route print //查询路由信息任选其一route print -4route print -6查询需要添加的外网网关ipconfig添加永久路由route -p add 0.0.0.0 mask 0.0.0.0 x.x.x.x // x.x.x.x为需要添加的网关route delete 0.0.0.0 mask 0.0.0.0 x.x.x.x ...

2019-12-11 10:19:30 556

原创 v-if/v-show状态值为数组某一项，改变不更新视图

条件判断v-if=arr[index]当arr[index]改变的时候试图不会更新变化，这个时候需要做特殊处理（v-show同理）vue官方提供方法this.$set(this.vifValue,i,false)//vm.$set(arr,index,newValue)死办法 // this.vifValue[i] = false// let arr = this.vifValue...

2019-07-31 14:51:27 1687

原创 sublime中PyV8问题

我这边是正常安装emmet,结果就是不能使用报错,Please …PyV8…，网上提示手动下载解压到C:\Users—\AppData\Roaming\Sublime Text 3\Packages结果打开发现我的目录下已经有PyV8解决办法参考博客把PyV8放到C:\Users*******\AppData\Roaming\Sublime Text 3\Installed Package...

2019-07-30 09:19:47 811

原创 window.print()简单使用

window.print()的使用整体打印隐藏掉不需要的结构 document.getElementsByClassName('xmbz')[0].style.display='none'; document.getElementsByClassName('reason')[0].style.display='none'; document.getElementBy...

2019-04-23 10:40:51 3158

原创 H5支付(微信之外浏览器调用微信支付前端内容)

H5官方文档一、公众号h5支付申请审核（后台统一操作，前端只需要给后台传值供后台在微信平台下单即可）二、调用后台接口，下单操作，接收微信返回的中间页地址（前端工作）三、加载微信返回的页面地址window.location.href = url //url为接口返回的地址前台支付完成或者放弃支付，页面会默认返回支付发起页；可以通过在url后拼接上redirect_url参数。例如...

2018-12-18 14:30:44 5885

原创 overflow:auto自动滚动到底部（vue）

在做消息的项目，当有新消息的时候让新消息出现在最底部，此时的box用的是overflow:auto注：vue项目需要注意在dom结构渲染完再进行操作<ul class="box" ref="chatContent"> <li v-for='item,index in direction' :class='item'> <span class...

2018-12-17 16:07:34 9409 1

原创 vue中全局路由守卫中替代this（this.$store/this.$vux）

全局路由守卫this.$vux.loading.hide()报错，访问不到this解决办法申明变量代替thismain.js文件方法router.beforeEach((to, from, next) => { if(vue){ vue.$vux.loading.hide() }else{ } next()})let vue = new Vue({ el: ...

2018-12-10 15:06:02 3442

原创 vue中img本地图片地址的具体使用

img标签的src如果是本地assets中的地址v-bind是不起作用的需要引入1、引入2、data3、v-bindjquery动态改变img的src本地地址

2018-12-03 17:35:38 13582

原创 axios本地请求带上了localhost:8080？

问题数据请求不通，发现请求地址前多出了localhost:8080解决办法地址写成了相对地址，地址不正确地址前面加http(s)

2018-11-30 13:00:22 13810 4

原创 Sublime安装px转rem插件

插件地址插件下载地址安装位置sublime软件头部导航中找到Preferences -> Browse Packages点击打开后把下载的文件复制进去。配置生效（配置后重启）Preferences -> Package Settings -> cssrem->Settings-user中配置具体配置内容{ "px_to_rem": 60, //px转r...

2018-11-14 14:09:31 428

原创搜索请求下需要闪烁的效果vue

需求vue使用的项目中页面搜索需要闪烁，项目中通过判断输入框的值得变化来请求数据，要求每次发起请求都需要页面闪烁解决方案在每次请求数据的时候把数据先清空，清空后再次请求数据，此时页面会闪烁一下。随便贴点代码// 监听动作搜索闪烁 flicker(){ // 顶部搜索内容改变 let id = this.$route.query.id; let ...

2018-11-05 10:01:11 698

原创 canvas学习笔记

canvas标签的系统学习笔记一、canvas用于图形绘制容器，具体的图形绘制需要依赖js。浏览器支持chromiefirefoxsafariopera4.09.02.03.19.0二、创建canvas<canvas id="myCanvas" width="200" height="100"style="border:1px solid ...

2018-10-26 15:09:25 130

原创手写无缝轮播$鼠标移入暂停移除轮播

无缝轮播使用插件Swiper没找到鼠标移入立即暂停功能，需求是并排几张图片无缝滑动，鼠标移入立即停止，鼠标移除立即滚动。六个展示位，七个内容html代码<ul class="div"> <li style="background-color:#cca6b5">内容一</li> <li style="background-color:#1ca...

2018-10-23 15:16:53 655

原创原生js实现select效果

前言在使用select时候原生默认样式很难修改特别是option的样式和鼠标经过option时候的样式改变很难覆盖，能力不足尚未实现，现自己写一个选择的效果DOM&lt;div class="selectBox"&gt; &lt;div class="select"&gt;&lt;span class="selectTex

2018-10-16 22:43:42 2880

原创 sublime text3入门级使用笔记

启用插件安装功能sublime使用安装插件是基础打开Sublime 按 ctrl+` 或者在View → Show Console在打开的窗口里黏贴网站上的代码package control安装完成后，按 Ctrl+Shift+p (Windows) / Command+Shift+p (Mac), 输入’Install Packages’，之后Sublime会自动下载插件列表...

2018-10-08 21:24:25 445

原创 this.$router.push不起作用（this指向错误）

this.$router.push不起作用（this指向错误）用that提前代替this此时可以正常使用

2018-09-25 15:11:17 23578 1

pdfh5.js移动端pdf预览

pdf.worker.js

pdf_2.1.266.js

空空如也