懵懂的程序员小曲-CSDN博客

原创字体图标以及svg图片的使用vite和webpack

vite webpack svg 矢量图标库

2022-11-16 14:21:35 1437 1

1.setInterval机制：延时一段时间后，将任务push到任务队列中排队执行；在每次把任务 push 到任务队列前，都要进行一下判断(看上次的任务是否仍在队列中，如果有则不添加，没有则添加)。基于该原理，会导致两个问题：前一任务结束到当前任务开始的时间间隔与设置的delay值不符。可能出现某些任务被跳过的情况（1）任务添加的时间间隔误差较大的情况setInterval(foo, delay)//当foo执行消耗800ms，delay为1000ms时，前一个任务执行结束到后一个任

2022-03-30 10:23:30 1519

原创关于http的一些东西

什么是http？HTTP 是一个用在计算机世界里的协议，它确立了一种计算机之间交流通信的规范，以及相关的各种控制和错误处理方式。HTTP 专门用来在两点之间传输数据，不能用于广播、寻址或路由。HTTP 传输的是文字、图片、音频、视频等超文本数据。HTTP 是构建互联网的重要基础技术，它没有实体，依赖许多其他的技术来实现，但同时许多技术也都依赖于它。http发展HTTP/0.9 结构比较简单，为了便于服务器和客户端处理，它也采用了纯文本格式。蒂姆·伯纳斯 - 李最初设想的系统里的文档都是只读的，

2022-02-25 18:19:15 355

原创时间复杂度和空间复杂度

在听到这两个名词的时候，感觉十分的高大上，其实很好理解通俗讲时间复杂度指的是一个算法执行所耗费的时间空间复杂度指运行完一个程序所需内存的大小复杂度的表现形式T(n) = O(f(n))，这个就是大O表示法，其中的T代表的是算法需要执行的总时间或者算法需要的总空间，f(n)表示的是代码执行的总次数时间复杂度let i = 1i++ // 执行1次i++ // 执行2次i++ // 执行3次console.log(i)上述代码在执行的时候，它消耗的时间并不随着某个变量的增长而增长，那

2021-12-07 10:48:23 335

原创 Vue3 teleport

Teleport 提供了一种干净的方法，允许我们控制在 DOM 中哪个父节点下呈现 HTML，而不必求助于全局状态或将其拆分为两个组件我认为的业务场景，其实就是写个弹窗 Toast之类的全局组件<teleport to="#some-id" /><teleport to=".some-class" /><teleport to="[data-teleport]" />demo 包含往teleport 组件传值<template> <d

2021-10-26 09:35:50 184

原创宏任务微任务消息队列事件循环

1.执行栈：showName()console.log(myname)var myname = 'JS执行栈'function showName() { console.log('函数showName被执行');}执行结果：函数showName被执行undefined原因：JS代码执行过程为：编译阶段：生成执行上下文和可执行代码。具体以这段代码为例：showName()console.log(myname)var myname = 'JS执行栈'function

2021-09-17 18:20:20 262

原创 vue3 keep-alive缓存问题

业务场景：详情页面A进入编辑页面B，编辑页面B进入选择页面C，选择页面C返回编辑页面B假如是vue2的话可以通过判断路由，来使变量初始化即可，因为vue2变量都是在data里面定义的，所以可以通过可以Object.assign(vm.$data, vm.$options.data())直接初始化变量。但是因为是vue3重构我们的变量都是在setup中，就不能通过这种办法来初始化变量方法1 错误通过meta里面的keepAlive来控制，我在a进入b的时候onBeforeRouteLeave(

2021-09-08 14:20:10 2186 7

原创 vue3 使用router4 keepalive问题

项目从vue2升级到vue3，路由也紧跟着升级到了4，然后在使用keep-alive的时候一直不生效，就去查文档vue2.x与vue3.0的App.vue配置有差异，在App.vue配置信息如下：vue2.x中，router-view可整个放入keepalive中，如下：<template>  <keep-alive> <router-view v-if="$route.meta.keepAlive" /&gt

2021-08-30 15:59:41 2394

原创 await 不能用在 forEach

通过打印发现是先走了走到forEach里面接口请求的时候没有等待就直接走了forEach外面的点击保存问题分析forEach 只支持同步代码polyFill的forEach的源码差不多就是下面这个代码这么个意思while (index < arr.length) { callback(item, index) //也就是我们传入的回调函数 }通过阅读polyfill的forEach源码，发现，forEach 只是简单的执行了下回调函数而已，并不会去处..

2021-04-13 14:28:47 300

原创 cropper插件截图框移动回调的防抖处理

之前有个项目需求是，在截图完成之后自动给服务器发送请求，cropper插件里有截图框移动的回调函数@cropMoving但是用了这个函数之后，截图框一移动就会请求。所以这时候需要防抖处理了// 截图框移动回调函数 cropMoving(data) { // 做一下防抖处理 this.time++; if (this.time > 1) { return; } else { // 截图框的左上角和右下角坐标

2021-02-05 14:00:35 192

原创 elementUI 上传文件使用formdata

根据elementUI的文档，是在上传的时候有一个上传图片的接口，点击上传之后会返回给你一个网络路径，你再将网络路径跟表单的其他的信息通过提交接口提交到后台<el-upload class="upload-demo" action="https://jsonplaceholder.typicode.com/posts/" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRem

2021-01-15 18:06:55 4142

原创 promise和async/await的区别

promise 对象是一个代理对象（代理一个值），被代理的值在Promise对象创建时可能是未知的。它允许你为异步操作的成功和失败分别绑定相应的处理方法（handlers）。这让异步方法可以像同步方法那样返回值，但并不是立即返回最终执行结果，而是一个能代表未来出现的结果的promise对象async函数总是返回一个promise对象。就算一个异步函数的返回值表面上不是一个承诺(promise)，只要它在async 函数中，它的本质也会是一个承诺(promise)。awiat 表达式会暂停当.

2020-09-19 11:12:58 2949

原创关于闭包以及this的指向

闭包，个人理解就是可以访问其他函数内部变量的函数function funA() { var a = 10; // funA的活动对象之中; return function() { // 这就是一个闭包 alert(a); }; } var b = funA(); b() // alert(10)以上代码的return的函数就是一个闭包。正常情况下我们访问不到函数funA里的变量a，但是我们通过定义一个return一个.

2020-09-12 11:35:50 1493

原创 vue-cropper插件使用

需求拍照之后裁剪照片，然后搜到了vue-cropper功能还是很强大的首先是使用方式组件内使用import { VueCropper } from 'vue-cropper' components: { VueCropper,},全局使用import VueCropper from 'vue-cropper' Vue.use(VueCropper)html中<vueCropper ref="cropper" :img="option

2020-07-17 17:33:01 727

原创 node学习笔记express注册接口以及出现post请求后台接收不到的问题

接上篇登陆接口代码很简单但是在写的时候出现了用axios传递参数但是后台接收不到，一直undefinedadmin.post('/register', async (req, res) => { const { username, email, password } = req.body let user = await User.findOne({ email }) if (user) { console.log(req.body) res.send('用户名已存在') }

2020-06-10 14:57:35 679

原创 nodejs-websocket实现简易广播

首先安装依赖npm install nodejs-websocket --save服务端部分 const ws = require('nodejs-websocket') //引入nodejs-websocket const server = ws .createServer((conn) => { console.log('ok') conn.on('text', (str) => { //接受客户端传来的消息 broadcast(str) })

2020-06-03 15:32:38 2279

原创 vue仿饿了么选择城市地址自动滚动

效果：用到 vue axios better-scroll 这里我全部用得cdn引入<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title&

2020-05-21 17:26:27 559

原创父子组件之间的传值

先准备一个例子，这是父组件传递给子组件。子组件使用props接收<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <scrip

2020-05-19 15:55:58 198

原创想要快速学习vuex 看这篇就可

Vuex是什么？官方解释：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式其实通俗讲就是在data中的属性需要共享给其他vue组件使用的部分，父子组件，兄弟组件之间的通信都可以通过vuex来实现Vuex都有什么？？const store = new Vuex.Store({ state:{ count:1 }, getters:{ personInfo(state){ return 'i am ' + state.count } }, mutation

2020-05-13 10:36:06 226 1

原创自动抢券脚本

这几天淘宝有活动，抢券的，朋友让帮忙写一个，上一个半自动化抢券吧。自动刷新自动点击。难点其实就是刷新的时候让控制台的代码还存在主要是先让脚本加载一下页面，然后再刷新，这样控制台的代码还存在，然后再关闭脚本加载的页面var qzycount = 0var timeout = prompt('设置刷新时间')current = location.href/*这边是找点击按钮，各有不同办法*...

2020-04-26 14:51:45 41176 29

原创 node学习笔记express登录接口

初始化项目，npm init --yes安装一下必须的依赖，npm install express npm install body-parser 安装express是我们要用的node框架，body-parser是我们接受post请求所用的中间件创建一个app.js模块，启动http服务 const express = require('express') const bodyPar...

2020-04-21 16:04:51 974 2

原创 vue swiper动态获取数据不滑动的解决方案

因为vue中更新 DOM 时是异步执行的，data() { return { imgArray: [] //轮播图片 } }, created() { this.getImgArray() }, mounted() { new Swiper('.swiper-container', { loop: true, // 循环模式选项 // 如果需要分页器...

2020-04-15 14:43:06 802

原创 node启动https服务以及重定向

想启动https 要先申请ssl证书，我是用得腾讯云的免费证书（ssl证书-证书管理-申请免费证书），然后下载证书会有一个压缩包，用Nginx的就ok，直接把crt文件的扩展名改成pem即可。然后我想访问http://www.qzycool.cn的时候直接跳转到https，一开始是用的iis的url重写发现不好使，可能是因为用node启动的服务，所以就只能在node里面写一个重定向，只要访问h...

2020-04-09 10:37:16 531

原创解决尚未运行windows远程管理的错误，附带ssl证书认证

ssl证书iis服务器安装：https://cloud.tencent.com/document/product/400/35225今天试着给域名添加ssl证书，然后照着文档进行到网站绑定这一步，一直报之后在网上搜了一堆的方法都不好使，然后提交了工单咨询了腾讯云那边给出的方法是重装一下程序吧，因为是刚买的服务器上面也没啥东西我就重装了。然后重装了一遍，在重装过程中，因为我要用80端口，我...

2020-04-07 14:20:34 1750

原创 css小技巧（持续更新）

这两天做项目遇到的一些css问题记录一下问题1 关于设置高度100%，然后又设置了padding或者margin，这样高度就是超出了100%以前的解决办法都是用calc(100% - padding或者margin的数值),但是css3出了个新属性box-sizing: border-box;意思为元素指定的任何内边距和边框都将在已设定的宽度和高度内进行绘制。通过从已设定的宽...

2020-03-26 15:48:01 117

原创通俗易懂深浅拷贝的理解

要理解深浅拷贝，就要先知道js的数据类型有哪些。分为基本数据类型(string,number,undefind,null,symbol,boolean)和引用数据类型(obj,array,function)基本数据类型以值得形式存储在栈中，操作的变量是值，而引用类型的值是存储在堆中，以地址来操作变量，也就是说，基本类型拷贝之后是重新在栈中开辟一个空间，两者不干扰，所以基本类型不分深浅拷贝。但是...

2020-03-13 17:45:08 1715

原创 woocommerce可变产品导入

这两天公司要求维护一下之前的woocommerce。13年公司请外包公司给做，我这刚接触一脸懵逼，然后打算导入数据，碰见了很多坑，这里先说一下导入产品时可变产品应该怎样操作坑1 ：一开始我不知道导入数据的格式是啥，然后我就先导出了一份数据，打算根据导出的这一份来改再导入但是这样做是不行的，你导出来的数据表头是中文的，你再导入的时候列映射会找不到匹配不上，数据是错误的解决方案：下载wooc...

2020-02-28 10:26:15 1634

原创 node学习笔记上传图片formidable方法

js代码<script> var file = document.getElementById("file"); file.onchange = function() { var form = new FormData(); //将用户选择的图片追加到form表单 //attrNa...

2020-02-25 17:04:17 311

原创对于js循环数据添加事件的方法

今天闲着没事突然间想到项目中经常遇到遍历数据，然后给每条数据添加点击事件看到大家都是bind方法来事件委托一下但是我觉得下面这个方法更简便一点吧var array = [ {name: 'zhangsan1',age: 18}, {name: 'zhangsan2',age: 19}, ]for (var i = 0; i < array.length; ...

2020-02-25 11:43:02 641

程序员小曲的博客