- 博客(48)
- 收藏
- 关注
RSS订阅原创 生成条形码
超市购物时，收银员所扫的就是条形码，每个条形码对应一个sku，只要商品的所有参数都相同，则sku是一致的。生成条形码方式安装js插件npm install jsbarcode在需要生成条形码的页面进行导入<template><svg class="barcode"jsbarcode-format="auto"jsbarcode-value='12345556'jsbarcode-textmargin="0"jsbarcode-fontoptions="bold
2021-03-03 14:14:29
287
1
原创 浅析微前端
微前端是什么？微前端就是将一个主应用按照不同功能拆分为不同的子应用，然后通过子应用来加载主应用。使用微前端有什么好处呢？可以在一个应用中使用多种技术栈。一个主应用拆分为多个子应用，这些子应用可交给不同的团队进行开发。对于项目中的老代码不宜改动，可使用微前端将其整体嵌入。微前端发展史2018年Sing-SPA实现了路由劫持和应用加载，但没有处理样式隔离和js执行隔离，不能动态加载js文件。子应用中// main.jsimport singleSpaVue from 'sing-s
2021-03-02 10:09:30
298
原创 FileReader的实际应用——用户头像上传
在最初学习FileReader的时候，了解到此API可以用来读取上传的图片信息进行图片预览，也可读取txt文件，但不清楚在实际项目中有什么应用，知道我需要修改用户头像时。。。基本的用法可参考：FileReader()读取文件接下来说说在上传用户头像时如何使用。首先是页面展示 <el-avatar :size="80" :src="userInfo.avatorUrl" class="avator"></el-avatar> <div class="imgbtn"
2021-02-21 23:00:27
177
原创 React基础
propspropTypes对props进行类型限制，defaultProps可以设置默认值class Demo extends React.component { staic propTypes = { name: PropTypes.string.isRequired, age: PropTypes.number, calcu: PropTypes.func // 函数类型 }; static defaultProps = { age: 18 }; //....
2021-02-07 22:30:01
136
原创 xss攻击（跨网站脚本攻击）
出现原因：恶意代码没有经过过滤，和合法代码混合在一起，浏览器无法识别那些是恶意代码，导致恶意代码被执行。解决方式：前端对输入进行过滤。输入侧对于明确的输入类型，比如数字，url，电话号码，邮箱，身份证等进行判断是否符合。后端使用模版引擎（doT.js、ejs等）进行转译HTML。也就是将&<>"’/几个字符转译掉。限制输入的长度。响应头设置cookie为HTTPOnly。大多数xss攻击都是通过脚本来盗取cookie，可设置HTTPOnly属性，禁止JavaScript读取c
2020-11-23 11:21:38
291
1
原创 Watch的内部原理（deep+immediate）
watch主要用来监听组件中某个值的改变，并执行对应的回调函数。wtach和computed的区别watch是一个值影响多个值computed是多个值影响一个值watch的内部原理先看源码中对于vm.$watch的实现// watch可以监听一个表达式（a.b.c）或者函数Vue.prototype.$watch = function (expOrFn, cb, options) { const vm = this; options = options || {}; const wa
2020-09-16 10:04:04
1110
原创 数组中的sort()方法
在sort()方法中可传入一个函数，该函数表示数组的排序规则sort()可以不传入函数，默认按照字符串的Unicode码点排序var arr = [1,3,2,9,4,7,8]arr.sort()console.log(arr) //[1, 2, 3, 4, 7, 8, 9]arr = [1,3,21,9,14,70,8]console.log(arr) //[1, 14, 21, 3, 70, 8, 9]升序排序var arr = [1,3,21,9,14,70,8]arr.s
2020-08-23 22:26:36
310
原创 排列组合
全排列function allPerm(arr) { var res = [] if(arr.length > 1) { //遍历每一项 for(let i = 0; i < arr.length; i++) { var left = arr[i] //拿到除了当前值的其他值 var rest = arr.slice(0,i).concat(arr.slice(i+1)) //上一次递归的全排列 var prePerm = allPerm(rest);
2020-08-18 00:32:21
169
原创 滑动窗口
一般有两个指针left和right，right用于向右移动扩大滑动区间，left向右移动缩小滑动区间（注意left和right的边界值）var minWindow = function(s, t) { //计算t中每个字符出现的次数 let obj = {} for(let i = 0; i < t.length; i++) { if(t[i] in obj) obj[t]++ else obj[t] = 1 } //滑动窗口的左右边界 var left = -1,
2020-08-17 23:54:56
138
原创 覆盖elementui的基本样式
在使用elementui等组件框架时，有时候里面的颜色等没有我们想要的，就可以进行自定义。局部覆盖时，在使用组件的页面，通过style标签，来覆盖自己的样式注：标签中不能加scoped<style lang="ts">.invoice_overview { .el-button--info,.el-radio__input.is-checked .el-radio__inner { background-color: #1890FF; border
2020-08-17 14:52:50
556
原创 矩阵
螺旋遍历矩阵/** * @param {number[][]} matrix * @return {number[]} */var spiralOrder = function(matrix) { if(matrix.length == 0) return []; var dx = [0,1,0,-1]; var dy = [1,0,-1,0]; var m = matrix.length; var n = matrix[0].length; v
2020-08-16 18:34:44
115
原创 在ts中使用dayjs
分为两种情况：没有在tsconfig.json中进行如下配置"compilerOptions": { "esModuleInterop": true, "allowSyntheticDefaultImports": true, }在使用dayjs的页面中通过如下进行导入important * as dayjs from 'dayjs';如果进行了配置，则需要通过如下方式导入important dayjs from 'dayjs';...
2020-08-14 20:50:07
3702
原创 解决首页面路由重复点击报错
多次点击路由跳转按钮，在控制台会报错，虽然对项目的运行没有什么影响，但总会觉得代码写的不够好解决办法：在导入路由的文件中加入下面代码/** * 修改首页面路由重复点击报错 */const originalPush = VueRouter.prototype.push;VueRouter.prototype.push = function push(location) { return originalPush.call(this, location).catch(err => er
2020-08-14 20:45:27
297
原创 LeetCode——全排列
给定一个 没有重复 数字的序列，返回其所有可能的全排列。示例:输入: [1,2,3]输出:[[1,2,3],[1,3,2],[2,1,3],[2,3,1],[3,1,2],[3,2,1]]解析（1）depth：递归到第几层（2）path：已经选了哪些数（3）vistied：记录这些数是否已经被选择var permute = function(nums) { var res = [] var visited = Array(nums.length).fill(fal
2020-06-22 23:47:30
183
原创 LeetCode——多数之和
两数之和给定一个整数数组 nums 和一个目标值 target，请你在该数组中找出和为目标值的那 两个 整数，并返回他们的数组下标。你可以假设每种输入只会对应一个答案。但是，数组中同一个元素不能使用两遍。示例:给定 nums = [2, 7, 11, 15], target = 9因为 nums[0] + nums[1] = 2 + 7 = 9所以返回 [0, 1]var twoSum = function(nums, target) { for(let i = 0; i < n
2020-06-21 23:53:36
556
原创 EventLoop例题
例1console.log('1');async function async1() { console.log('2'); await async2(); console.log('3');}async function async2() { console.log('4');}process.nextTick(function() { console.log('5');})setTimeout(function() { console.
2020-06-16 18:12:23
486
2
原创 leetcode——最长回文子串
题目给定一个字符串 s，找到 s 中最长的回文子串。你可以假设 s 的最大长度为 1000。示例 1：输入: “babad”输出: “bab”注意: “aba” 也是一个有效答案。示例 2：输入: “cbbd”输出: “bb”中心扩散法最长的回文子串的长度可以分为奇数个和偶数个。遍历字符串中的每一个字符，假设该字符属于回文子串的中间项回文子串的长度为奇数个时，判断i-1和i+1是否相等假设回文子串的长度为偶数个时，判断i和i+1是否相等function longesPalidro
2020-06-06 18:15:39
162
原创 跨域传输
非同源限制cookie、LocalStorage和indexDB无法获取无法操作其他源下的DOMAjax请求不能发送JSONP原理script标签中的src可进行跨域，且脚本具有加载完就立即执行的特点前端将要跨域的url和要执行的函数名拼接作为src的值服务器取出函数名，将要传的值放在函数参数中，拼接为字符串返回缺点：需要前后端配合只能进行get跨域具体操作前端<script> function func(data){ //打印服务器返回的数
2020-05-29 10:30:27
767
原创 leetcode——最小覆盖字串（滑动窗口）
题目给你一个字符串 S、一个字符串 T，请在字符串 S 里面找出：包含 T 所有字符的最小子串。示例：输入: S = “ADOBECODEBANC”, T = “ABC”输出: “BANC”说明：如果 S 中不存这样的子串，则返回空字符串 “”。如果 S 中存在这样的子串，我们保证它是唯一的答案。解析新建对象obj记录t中每种字符串出现的次数，并记录t中的字符串种类数targetvar obj = {}for(let c of t){ if(c in obj) obj[c]+
2020-05-23 22:19:37
147
原创 leetcode——从先序遍历与中序遍历序列构造二叉树
题目根据一棵树的前序遍历与中序遍历构造二叉树。注意:你可以假设树中没有重复的元素。例如，给出前序遍历 preorder = [3,9,20,15,7]中序遍历 inorder = [9,3,15,20,7]返回如下的二叉树：二叉树深度遍历先序遍历：DLR中序遍历：LDR后序遍历：LRD根据中序和先序遍历序列重构二叉树由先序遍历特点可知，先序遍历第一个数据为根节点数据，则该二叉树的根节点值为preorder[0]=3由中序遍历特点可知，根节点左边为左子树中序遍历结果，即[9]
2020-05-22 23:44:19
492
1
原创 iconfont使用
选择要使用的图标添加到购物车将图标从购物车中添加至项目点击更多操作->编辑项目在要使用的文件中引入 <script src="//at.alicdn.com/t/font_1836275_ngablkhyczp.js"></script>在要使用图标的地方引入可在svg中添加类名，编写css样式...
2020-05-22 20:15:36
180
原创 删除已经提交至github上的文件夹
参考：https://blog.csdn.net/wudinaniya/article/details/77508229在github上无法直接删除项目中的某个文件夹，必须使用git命令来操作想要删除上述三个文件夹git --help 帮助命令git pull origin master 将远程仓库里的项目拉下来dir 查看该项目有哪些文件夹git rm -r --cached target 删除target文件夹git commit -m ‘删除了xxx’
2020-05-22 15:58:25
250
原创 vue造轮子——button
创建index.html文件，使用script标签引入vue.min.js创建button.js文件，编写button相关内容Vue.extend()：创建组件构造器，传入的template代表创建的组件的模板Vue.component(‘组件名称’,组件构造器)：注册组件（全局组件）index中使用创建出的按钮组件，并编写button的css样式安装第三方打包工具parcel属于开发时依赖创建打包文件4. 新建文件目录src，添加app.js和button.vue5. .
2020-05-22 15:39:27
223
原创 vue造轮子——项目初始化
创建一个新的github仓库新建一个新的项目文件夹添加README.md文件不能直接在VSCode中使用该命令，无法识别touch指令README.md中添加内容将README.md提交到github上使用npm作为第三方工具安装node初始化npm也可以使用npm init -y生成一个默认的package.json提交到github仓库安装vue高版本的npm默认添加–save创建.gitignore文件，不提交node_mod..
2020-05-22 10:34:37
492
原创 leetcode——链表排序（插入排序）
插入排序：讲一个元素看做有序序列，其他元素看做无序序列，从无序序列中取出一个元素插入到有序序列中时间复杂度 = O(n^2)空间复杂度 = O(n)题目：使用插入排序对链表进行排序。代码：/** * Definition for singly-linked list. * public class ListNode { * int val; * ListNo...
2020-04-06 18:24:17
194
原创 leetcode——链表排序（归并排序）
归并排序：（1）待排序的数组、链表从中间一分为二（2）递归将左半部分进行归并排序（3）递归将右半部分进行归并排序（4）将左半部分和右半部分进行有序合并分割次数 = log2^n时间复杂度O(nlogn)空间复杂度O(n)题目：在O(nlogn)的时间内使用常数级空间复杂度对链表进行排序。解析：时间复杂度为O(nlogn)的排序算法有归并排序和快排归并排序的空间复杂度为O...
2020-04-06 16:23:36
260
1
原创 leetcode——逆波兰表达式
中缀表达式转逆波兰表达式：使用栈结构规则：（1）运算符优先级 ( > * / > + - > (（2）建立两个栈，分别是数字栈和运算符栈（3）遇到数字压入数字栈（4）遇到(或读取到的运算符 > 栈顶元素，压入运算符栈（5）遇到）弹出运算符直到弹出（（6）新读取到的运算符<=栈顶元素，弹出所有>=新读取到的运算符的运算符，该运算符入栈（7）读...
2020-04-03 22:11:44
263
原创 leetcode——求二叉树的最大（小）深度
最大深度：从根节点到叶子节点的最长路径上的节点个数最大深度为3规则：（1）二叉树为空，返回0（2）递归计算左孩子和右孩子的深度，取最大值+1代码实现/** * Definition for binary tree * public class TreeNode { * int val; * TreeNode left; * TreeNode righ...
2020-04-02 22:44:56
231
原创 二叉树的镜像
题目描述操作给定的二叉树，将其变换为源二叉树的镜像。输入描述:二叉树的镜像定义：源二叉树分析：使用递归将每一个节点的左右子节点进行交换注意:：不能只交换值，而应该交换结点，因为交换8的子节点6和10之后，8的左子树值变为了10,9,11，而不是10,5,7代码实现/* function TreeNode(x) { this.val = x; this.left = ...
2020-03-26 21:21:37
98
原创 剑指Offer——数的子结构
题目描述输入两棵二叉树A，B，判断B是不是A的子结构。（ps：我们约定空树不是任意一个树的子结构）分析这样的结构称为B是A的子结构。当A树和B树的某个节点值相等时，开始比较B树和A树的节点值是否相等，直到B的每个节点遍历结束都是相等的，则B是A的子结构。注意：A树不一定只有一个值与B树根结点的值相等代码/* function TreeNode(x) { this.val = ...
2020-03-26 20:56:23
111
原创 通知的更多功能
1. 播放音频setSound()方法接收一个Uri参数，所以在指定音频文件时要先获取音频文件对应的URI。例如每个手机/system/media/audio/ringtones目录下有很多音频文件，我们从中随便选一个文件，就可这样指定：Notification notification = new NotificationCompat(this,"default") ...
2019-06-16 18:41:11
275
原创 使用通知
创建通知的基本步骤1. 获取NotificationManager实例getSystemService()：接收一个字符串参数用于确定获取系统哪个服务。NotificationManager manager = (NotificationManager) getSystemService(Context.NOTIFICATION_SERVICE);2. 使用Builder构造器创建No...
2019-06-16 17:50:30
222
原创 静态注册实现开机启动
静态注册方式：在AndroidMainfest中注册。可以让程序在未启动的情况下就能接收到广播。1.创建广播接收器右击com.example.broadcasttest包–>New–>Other–>BroadcastReceiver，将广播接收器命名为BootCompletedReceiver，选择Exported和Enable属性。Exported：表示是否允许这个广播...
2019-06-16 15:54:44
443
原创 广播的最佳实践——实现强制下现功能
新建项目BroadcastBestProctice1.创建一个类ActivityCollector用于管理所有活动package com.example.broadcastbestpractice;import android.app.Activity;import java.util.ArrayList;import java.util.List;public class A...
2019-06-16 15:54:29
205
原创 发送自定义广播：跨进程通信、发送有序广播、发送标准广播、本地广播
发送标准广播1.新建一个广播接收器MyBroadcastReceiverpackage com.example.broadcasttest;import android.content.BroadcastReceiver;import android.content.Context;import android.content.Intent;import android.widget...
2019-06-16 15:54:14
671
原创 内容提供器——跨程序共享数据
在DatabaseTest项目的基础上继续开发DatabaseTest项目见持久化技术——SQLite数据库存储1. 创建内容提供器右击com.example.databasetest包–>New–>Other–>Content Provider，将内容提供器命名为DatabaseProvider，authority指定为com.example.databasetest.p...
2019-06-16 11:55:59
192
原创 数据存储全方案——SQLite数据库存储
创建数据库SQLiteOpenHelper是一个抽象类。包含抽象方法：onCreat()、onUpgrade()。包含实例方法：getReadableDatabase()、getWritableDatabase()。两个实例方法都可创建或打开一个现有的数据库，并返回一个可对数据库进行读写操作的对象。但当数据可以不可写入的时候，getReadableDatabase()方法返回的对象将以只...
2019-06-13 17:41:46
762
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人