Mingchen Shao-CSDN博客

原创 Docxtemplater 实现前端在线生成word,并添加签名图片到指定位置，图片去四周无用透明区域

Docxtemplater 实现前端在线生成word,并添加签名图片到指定位置，图片去四周无用透明区域

2022-12-22 17:38:14 1072 1

原创几种常见的排序

冒泡排序function arr_sort(arr){ for(let i = 0;i<arr.length-1;i++){ //一共几轮 for(let j = 0;j<arr.length-i;j++){ //每轮几次 if(arr[j]>arr[j+1]){ //把大的数字放到后面 var swap = arr[j]; arr[j] =

2021-04-14 16:56:57 134

Math 是数学函数，但又属于对象数据类型 typeof Math => ‘object’console.dir(Math) 查看Math的所有函数方法。1，Math.abs() 获取绝对值Math.abs(-12) = 122，Math.ceil() and Math.floor() 向上取整和向下取整console.log(Math.ceil(12.03));//13console.log(Math.ceil(12.92));//13console.log(Math.floor(12

2021-04-14 15:46:33 160 1

原创二分法（笔记）

/** * 二分法 * @param {*} arr 一个有序的数组 eg: [1,2,3,4,5,6,7,8] * @param {*} key * 返回相同项的下标 */function binary_while(arr,key){ var left = 0,right=arr.length-1; while(left>=right){ var min = parseInt((right - left)/2); if(key =

2021-04-13 16:32:06 186

原创算法之时间复杂度-空间复杂度(笔记)

对于时间复杂度是指的算法语句的执行次数。一个算法语句的执行次数最终都是可以通过函数f(n)来形容的。1：int i = 0;while(i < 100){ i++;}这里的i++就是算法语句，那么其f（n） = 100 - i -1；就可以知道他的时间复杂度了。2：for(int i = 0; i < n; i++){ for(int j = 0; j < n; j++){ console.log("-"); }}这输出语句就是算法

2021-04-12 18:46:14 219 1

原创数据结构（笔记）

栈和队列的区别队列（Queue）：是限定只能在表的一端进行插入和在另一端进行删除操作的线性表；栈（Stack）：是限定只能在表的一端进行插入和删除操作的线性表。区别如下：一、规则不同队列：先进先出（First In First Out）FIFO栈：先进后出（First In Last Out ）FILO二、对插入和删除操作的限定不同队列：只能在表的一端进行插入，并在表的另一端进行删除；栈：只能在表的一端插入和删除。三、遍历数据速度不同队列：基于地址指针进行遍历，而且可以从头部或者尾部

2021-04-12 17:00:49 91

原创为较完美解决精度丢失问题的json编辑器

其实就是代码编辑器，用到这有点大材小用，不过也正是因为字符串为value，进而完美解决了精度丢失的问题1.安装npm i monaco-editornpm i monaco-editor-webpack-plugin2.配置webpack vue-cli4const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');configureWebpack: { // provide the app's title i

2021-02-07 20:18:16 356

原创 vue-cli4.0 实现前端代理解决跨域

前端代理是代理到自己本地，所以只有开发环境下能用在vue.config.js 添加proxy: { //需求列表 '/dev-api': { target: 'http://*****', ws: true, secure: false, changOrigin: true, pathRewrite: { '^/dev-api': '',// 替换成target中的地址 } },...

2021-02-02 17:13:59 269

原创 axios的常用封装

1.先写一个类/** * axios请求的类 */import axios from 'axios'import { MessageBox, Message } from 'element-ui'import store from '@/store'import { getToken } from '@/utils/auth'import Env from '@/api/env/index'; // create an axios instanceconst service

2021-02-02 17:07:03 259

原创 axios请求五种方法（笔记）

axios请求五种方法一、介绍Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。可以提供以下服务:1、从浏览器中创建XMLHttpRequests2、从node.js创建http请求3、支持PromiseAPI4、拦截请求和响应5、转换请求数据和响应数据6、取消请求7、自动转换JSON数据8、客户端支持防御XSRF二:使用1、axios的安装:安装命令; npm install axios2、axios五种请求:1⃣️get: 一

2021-02-02 16:50:48 1166

原创两种前端在线json编辑器方案(无法解决number精度丢失问题)

vue-json-editor1.安装vue-json-editornpm install vue-json-editor --save2.在.vue 文件中引用import JsonEditor from "vue-json-editor";3.使用<template> <div class = "routeManagement"> <vue-json-editor v-model="routeJson" :showBtns="tru

2021-02-01 11:14:17 808

原创 ECMAScript 版本 (笔记)

ECMAScript 版本ECMAScript 不同的版本以“edition”表示（也就是描述特定实现的 ECMA-262 的版本）。ECMA-262最近的版本是第 10 版，发布于 2019 年 6 月。ECMA-262 的第 1 版本质上跟网景的 JavaScript 1.1 相同，只不过删除了所有浏览器特定的代码，外加少量细微的修改。ECMA-262 要求支持 Unicode 标准（以支持多语言），而且对象要与平台无关（Netscape JavaScript 1.1 的对象不是这样，比如它的

2020-12-10 19:55:41 456

原创 js设计模式之发布订阅模式 + 观察者模式 + 实现vue的响应式（笔记）

笔记笔记笔记新鲜出炉的笔记首先说观察者模式：他俩定义了一种一对多的依赖关系。让多个观察者对象同时监听某一个主题对象。这个主题对象在状态变化时，会通知所有的观察者对象，使他们能够自动更新自己。比如举个例子：红绿灯和行人。红绿灯为被观察者，行人为观察者。当绿灯亮起时，人要通过了而且是必须通过。红灯时，必须停下。这就是一个观察者模式。很多个行人同时为一个红路灯指示器作出响应。发布订阅模式的区别：必须有一个中间调用层，举例子来说就是比如：送报纸的，报亭，和买报纸的人。报亭就是那个全局调用区域。送报纸

2020-12-08 14:37:46 473 2

原创 forEach总结（笔记）

粘贴过来的源码实现：var arr = [1, 2, 3, 4, 5]Array.prototype.myForEach = function(fn){ var len = this.length; for(var i = 0; i < len; i ++){ //将元素传给回调函数 fn(this[i],i); }}arr.myForEach(function (ele, index){ console.log(ele, ind

2020-12-01 13:58:02 191

原创 Vue源码解析+关于组件的data属性+为什么组件内data可以直接this等等（摸索）

疑问1：为什么组件内data为方法而不是一个对象？疑问2：为什么data就挂在了Vue实例上，用this直接取？源码//初始化function initData(vm: Component) { let data = vm.$options.data //组件数据 data = vm._data = typeof data === 'function' //放在实例的_data属性上， ? getData(data, vm) : data || {} ....

2020-11-27 11:32:04 492 2

原创 openlayers地图组件的封装

<template> <div id="Gmaps" ref="Gmaps" tabindex="1"></div></template><style scoped>#Gmaps { width: 100%; height: 100%;}</style><script>/** * moveEvent 地图的移动事件 * clickEvent 地图自定义点击事件 * getMap 挂载到实例

2020-11-24 19:44:45 919

原创 Object.assign() 源码以及分析

官方：Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象用法const target = { a: 1, b: 2 };const source = { b: 4, c: 5 };const returnedTarget = Object.assign(target, source);console.log(target);// expected output: Object { a: 1, b: 4, c: 5 }consol

2020-11-23 18:38:56 540

原创和马保国一起玩转 call和apply

call和apply相同点：改变函数中的this指向。不同点：传参方式不同，target.call(source，param1,param2,…)target.apply(source，[param1,param2,…])let MaBaoGuo = { skill: '一鞭，二鞭，三鞭，四鞭，五鞭，收！', word: '啊！我大意了，没有闪！', wuLianBian: function () { return "给大家展示，看好喽！" + this.

2020-11-23 17:55:31 301 2

原创 Echarts自定义主题构建

1.打开在线主题构建工具，echarts官网。2.可以随意搭配，搭配完毕后，点击主题下载，导出js文件。3.导出代码如下图4.引入，可以注册到全局。import "./vender/echartsTheme/macarons";import "./vender/echartsTheme/homeTheme";5.echarts初始化的时候在init方法传入// 实例化this.chart = echarts.init(node,‘macarons’);...

2020-11-20 14:58:54 583

原创 axios.CancelToken取消当前接口调用。

1.首先挂载在全局一个变量，在main.js中取消axios请求的操作，存放所有cancel函数 Vue.$httpRequestList = [];2.其次就是在封装POST方法。```javascriptconst CancelToken = axios.CancelToken;//通用方法/** * * @param {*} url * @param {*} params * @param {*} fun 终止方法 */export const POST = (u

2020-11-19 09:57:23 1024

原创 cookie实现免登录

cookie实现免登录/**保存 Cookie@param name@param pwd@param exdays*/export function setUserCookie (name,pwd,exdays) {var exdate = new Date(); //获取时间exdate.setTime(exdate.getTime() + 24 * 60 * 60 * 1000 * exdays); //保存的天数//字符串拼接cookiewindow.docume

2020-11-16 10:09:47 587

原创 js防抖与节流函数

防抖与节流函数/**用于防抖，echarts的resize方法。@param {*} func 防抖的函数@param {*} wait 时间间隔@param {*} immediate*/export function debounce(func, wait, immediate) {let timeout, args, context, timestamp, result;const later = function() {// 据上一次触发时间间隔const la

2020-11-16 09:48:10 87

原创 vue项目搭建目录以及标准（慢慢摸索）

项目搭建：1.项目公共组件放在src/components。2.由于代码结构复杂拆分出去的，业务组件放在子目录components。3.vue文件里面把数据处理代码拆分出去，写好的文件css也独立拆分出去（细小的组件一行两行的未拆分）。使得vue文件组件划分：View层减重的基础，将可共用的视图组件剥离出去，改为消息机制进行通信，甚至直接剥离出包含视图和业务代码的业务逻辑组件，都可以有效地拆分View层，降低代码的复杂度。Api/ axios的统一放置/api_user 接口

2020-11-13 18:39:09 644

原创 htmlcanvas2 传入节点生成图片

/**htmlcanvas2 传入节点生成图片*/canvas canvas.toDataURL 图片太大会导致保存失败，解析出来的超出了浏览器对于url的限制故使用canvas.toBlobimport html2canvas from ‘html2canvas’;/**htmlcanvas2 传入节点生成图片@param {*} node 节点/export function captureScreen(node) {// 调用html2canvas插件html

2020-11-13 18:35:25 273

原创 git命令

git命令git 1 rm -rf node_modules2 rm package-lock.json3 npm cache clear --force4 npm install初始化：创建一个git仓库，创建之后就会在当前目录生成一个.git的文件git init添加文件：把文件添加到缓冲区git add filename添加所有文件到缓冲区（从目前掌握的水平看，和后面加“.”的区别在于，加all可以添加被手动删除的文件，而加“.”不行）：git add .git add --al

2020-11-13 18:33:23 145

原创 openlayers中实现圈选、多边形选择点要素

/**添加画图圈圈*/function drawInteraction(Googlemap,features,layers) {var source = new SourceVector({features: features,})var draw = new olInteraction.Draw({source: source,type:“Polygon”, //为多边形 Circle 为圆形});Googlemap.addInteraction(draw);d

2020-11-13 18:32:00 1534 3

shaoxxxxx的博客