- 博客(38)
- 资源 (4)
- 收藏
- 关注
RSS订阅
原创 vue核心diff算法简介
一.diff算法的事件复杂度两个树的完全的diff算法是一个事件复杂度为O(n3) ,Vue进行了优化O(n3) 复杂度的问题转换成O(n)复杂度的问题(只比较同级不考虑跨级问题),因为在前端操作dom的时候,不会把当前元素作为上一级或下一级元素,很少会跨越层级地移动dom元素,常见的都是同级比较,所以Virtual Dom只会对同一级的元素进行对比.二.vue中diff算法的原理在数据发生变化,vue是先根据真实dom生成virtual dom,当virtual dom 某个节点的数据改变后会生成一
2021-04-19 18:46:00
379
原创 git版本控制工具的安装以及关联远程仓库(gitee为例)
安装git(版本控制工具)360软件管家安装(网络不佳的同学)git --version(测试是否安装完成,或者在桌面右击可以看到Git Gui here和Git Bash here)配置用户名和邮箱:(修改用户名和邮箱重执行下面的两个命令即可) $ git config --global user.name "名字" $ git config --global user.email "邮箱"创建版本库mkdir 文件名加后缀(创建文件)git init (初始化仓库)基
2021-04-12 22:32:22
117
原创 nodejs安装过程
1.下载nodejs安装包点击这里下载我这里下载的是Windows版本的msi版，如果下载的是压缩包，解压在相应的文件夹下即可2.安装完成后测试3、环境变量配置以及测试这里的环境配置主要配置的是npm安装的全局模块所在的路径，以及缓存cache的路径，之所以要配置，是因为以后在执行类似：npm install express [-g] （后面的可选参数-g，g代表global全局安装的意思）的安装语句时，会将安装的模块安装到【C:\Users\用户名\AppData\Roaming\npm】路径
2021-03-06 20:35:34
365
原创 在使用create-react-app创建的项目中配置mobx
第一步正常创建项目第二步安装依赖//使用yarnyarn add react-app-rewired yarn add customize-cra @babel/plugin-proposal-decorators --dev//使用npmnpm install react-app-rewirednpm install customize-cra @babel/plugin-proposal-decorators --dev第三步替换package.json中的scripts内容/
2021-06-04 14:38:41
171
原创 Vuex数据状态持久化和localstorage一样的小姑,而且还简单
vuex可以进行全局的状态管理，但刷新后刷新后数据会消失，这是我们不愿意看到的。怎么解决呢，我们可以结合本地存储做到数据状态持久化，但是太麻烦每次都要操作，强烈建议使用插件利用vuex-persistedstate插件.两种vuex-persistedstate和vuex-persist如何使用请查看GitHub详解vuex-persistedstate传送门和vuex-persist传送门...
2021-06-02 16:37:08
152
原创 在react中使用styled-components的几个简单使用方式
安装:npm install styled-components引入:import styled from "styled-components";基本使用 /* 创建了一个Wrapper样式组件，该组件渲染之后是一个div标签 */ const Wrapper = styled.div` color: blue; `; <Wrapper > <span>这是一个styled-components定义的组件</span>
2021-06-02 11:25:49
560
原创 react中使用保存table表格数据为excel表格文件,同时保存两个多个工作簿
保存table数据为excel表格文件依赖包:npm install xlsx引入:import XLSX from "xlsx";使用: let workbook = XLSX.utils.book_new(); let ws1 = XLSX.utils.table_to_sheet(document.getElementById("table1")); XLSX.utils.book_append_sheet(workbook, ws1, "Sheet1"); let
2021-06-02 10:23:05
524
原创 在vue中使用elementUI配置中英两种语言,使用i18n(@8.x)一起配置
在src目录下,创建lang.jsimport Vue from 'vue'import Element from 'element-ui';import enLocale from 'element-ui/lib/locale/lang/en'import zhLocale from 'element-ui/lib/locale/lang/zh-CN'const messages = { en: { //这里同级可以编写自定义的英文库 home:{ title:'Title
2021-05-12 08:49:47
646
原创 使用vue导航守卫踩过的坑
第一个坑这里使用了next(’/login’)直接跳转到登录页面,就会报第一张图片那样的错(但是不影响正常跳转),始终没找到原因,第一种:随后使用 router.push('/login')即可跳转后来在网上看到,第二种:把vue-router的版本降低到3.x也是可以的,试了一个,的确可行,这里就不放图了,回头找到产生原音了,再来这里补充,或者有哪位大神指点一下也可以...
2021-04-29 16:21:08
169
原创 vscode刚启动就占满cpu,启动程序中显示rg.exe占用的最多,关闭就好了,但是每次手动关闭很麻烦
然后在vscode的设置里面找到了修改的地方,在vscode的首选项设置里面,搜索这个search.followSymlinks然后把选项取消勾选如下图:这样启动之后就不会再有cpu占用百分百的情况出现了,网上说出些这样的情况是因为node-nodules文件导致的,所以有另一个方案,就是把node-modules文件夹屏蔽掉,不在显示,据说效果可以,我没有试过,因为我觉得不太方便,尤其是需要在node-modules看一些源码的时候,还得再调出来,麻烦,我就是一个懒人,所以推荐上面的方法,不过下
2021-04-18 15:23:05
882
原创 webstorm常用快捷键和react项目的快捷键
代码标签输入完成后，按Tab，生成代码。ctrl + a - - 选择全部ctrl + b - - 跳到变量申明处,快速打开光标处的类或方法ctrl + c - - 复制ctrl + d - - 如果选择了文本那么就是向此行的末尾复制，如果没有选中文本那就是将此行向下复制ctrl + e - - 弹出最近打开文件列表，可以快速选择最近曾经打开的文件。ctrl + f - - 在所在的文件内查文本ctrl + g - - 跳转至指定行指定列（列可以不填）ctrl + h - - 显示类结构图(
2021-04-07 21:50:18
1698
1
原创 react父子之间互相传值小demo
第一步:构建react环境:命令一键快速搭建$ npx create-react-app app-name1.创建两个.jsx文件,并在入口index.js中引入父文件,在父文件中引入子文件创建的两个文件在index.js中引入父文件在父文件中引入子文件2.两个文件的内容分别为:*** 子文件中的内容如下 ****** 父文件中的内容如下 ***子传父这里是将父文件中的parentValue变量的值传递给子文件在子文件中需要使用this.props.data来接受注
2021-03-30 21:12:02
132
原创 微信小程序自定义组件小案例
第一步准备好微信小程序开发工具并创建一个项目第二步创建一个将要使用组件的页面,和一个存放组件的页面例如下图第三步:在子组件上编写布局/样式/js逻辑等内容并在父页面使用在父页面的json文件中配置需要的子组件如下图:在父页面的wxml中使用:(json中的key值就是标签名)这时就可以在模拟器中看到效果了第四步:父页面向子组件传值 配置如下:父页面:(js中的data中有一个变量countNum)正常来说数据应该是通过网络请求来的,这里省略了,用模拟数据代替子组件:到这一步
2021-03-25 20:19:50
338
原创 html单行不换行溢出部分以省略号显示,多行文本溢出以省略号显示
单行文本不换行,溢出以…省略overflow: hidden;text-overflow: ellipsis;white-space: nowrap;多行文本换行,溢出以…省略号显示overflow : hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;相关解释:常见结合属性：display: -webkit-box; 必须结
2021-03-24 19:03:20
156
原创 node工具之nodemon使用
nodemonnodemon是一种工具，可以自动检测到目录中的文件更改时通过重新启动应用程序来调试基于node.js的应用程序。安装npm install -g nodemon//或npm install --save-dev nodemon使用nodemon ./main.js // 启动node服务nodemon ./main.js localhost 6677 // 在本地6677端口启动node服务延时重启nodemon -delay10 main.jsnodemon
2021-03-13 11:27:46
271
原创 cmd常用命令
启动窗口:1.windows+r ---->cmd回车2.通过搜索框-运行--->cmd回车3.在想要打开的文件夹下按下shift然后点击右键选择"在此处打开Powershell"，单击打开即可，模仿命令窗口，功能一样4.vs-code中的模拟窗口用Ctrl+反斜杠（tab上面的那个键）1.切换盘符直接输对应的盘符加英文状态下的冒号,然后直接回车，例如：d:2.进入目录cd 目录/目录3.返回上一级目录cd … cd …/4.自动补全Tab按键5.创建文件夹m
2021-03-12 15:09:37
269
1
原创 cnpm安装完毕cnpm没反应,不报错,没有任何提示
卸载 npm uninstall -g cnpm --registry=https://registry.npm.taobao.org注册 npm set registry https://registry.npm.taobao.org解析 npm set disturl https://npm.taobao.org/dist安装 npm install -g cnpm --registry=https://registry.npm.taobao.org
2021-03-12 14:36:42
393
原创 javascript中数组的ES6新增常用的知识点
扩展运算符(…)含义:扩展运算符(spread)是三个点,可以看做是rest参数的逆运算,可以将一个数组转为用逗号分隔的参数序列.函数调用和数组合并()console.log(...[1, 2, 3])// 1 2 3console.log(1, ...[2, 3, 4], 5)// 1 2 3 4 5[...document.querySelectorAll('div')]let a=[1,2,3,4];let b=[9,8,7];let c=[...a,...b];//1 2 3
2021-03-11 21:27:34
92
原创 ES6的字符串中常用的知识总结
1. 字符串遍历ES6为字符串添加了遍历器接口,这样字符串就可以使用for…of循环遍历了而且还可以识别大于0xFFFF的码点,传统的for循环无法识别.for (let codePoint of 'foo') { console.log(codePoint)}//输出为:"f","o","o"2.模板字符串${}个人认为字符串中最好用的连接字符的方式.让我们不再为字符和变量之间的拼接而烦恼模板字符串（template string）是增强版的字符串，用反引号（`）标识(若字符串中需要表
2021-03-11 19:49:49
208
原创 常用Javascript函数与原型功能收藏(必看)
// 重复字符串String.prototype.repeat = function(n) { return new Array(n+1).join(this);} // 替换全部String.prototype.replaceAll = function(str1, str2) { return this.replace(new RegExp(str1, "gm"), str2);} // 清除空格String.prototype.trim = function() { re
2021-03-11 15:05:43
175
原创 javascript常用方法汇总,防止忘记
1.输出语句：document.write("");2.JS中的注释为//3.传统的HTML文档顺序是:document->html->(head,body)4.一个浏览器窗口中的DOM顺序是:window->(navigator,screen,history,location,document)5.得到表单中元素的名称和值:document.getElementById(“表单中元素的ID号”).name(或value)6.一个小写转大写的JS: document.getEle
2021-03-11 15:04:24
163
原创 推荐一个特别好用的软件,简直就是懒人神器,强迫症的福音
utools支持Mac和Windows和Linux就是这个软件,特别好用和简洁上面这个界面就是搜索的界面,是不是很简洁还有很多的插件库
2021-03-08 09:54:17
165
原创 解决vscode打开TXT文本显示乱码,关闭右侧缩略图预览,关闭单击预览,设置只能双击打开文件
1.打开设置2.搜索 files.autoGuessEncoding3.勾选选项,
2021-03-06 22:25:40
623
原创 vscode顶部出现不受支持提示
安装Fix VSCode Checksums打开命令面板，快捷键 Ctrl + Shift + P 输入命令Fix Checksums:Apply最后一步重启Vscode，解决。
2021-03-04 17:58:33
1292
2
原创 h5调取摄像头实时显示并点击按钮拍照
这是一个简单是实例版本,具体的功能可以根据以下代码进行增加功能,并且下面都有相对应的注释<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatib
2021-03-04 16:56:47
1151
1
原创 vscode设置透明窗体
之前用过window opacity插件,然而效果并不好,这个透明效果还可以,是我想要的那种插件就是这个GlassIt-VSC,安装上之后直接找扩展设置我的找不到,关掉重启之后才出现,如果你的也是没有出现扩展设置的内容,不防关掉重启一下试试!...
2021-03-04 14:24:44
739
1
原创 移动端布局两种初始化写法
第一种,移动端布局vw写法(设计稿以750px为例)html{ font-size: 13.333333vw;}@media (min-width: 750px){ html{ font-size: 100px; }}body{ margin: 0 auto; font-size: 24px; max-width: 750px;}第二种:rem,用js方式,同样也是以设计稿750px为例js配置(function (doc, win) {
2021-03-02 16:49:42
180
原创 实现使用vscode和Chrome实时效果
第一步:在vscode中安装插件live server第二步配置vscode,将左边的复制到右边并修改,下面图片是已经复制并修改过了,你也可以直接按照这个添加进用户的设置中也可以第三步,配置Chrome,详细的参照webstorm实时效果的Chrome配置,一样的第四步,重启vscode,打开文件使用鼠标右键选择Open with live Server打开就可以了.配置赶紧去试试吧!...
2021-03-02 14:16:16
459
原创 使用新版webstorm和Chrome配合，实现实时刷新，可以边写代码边看效果
使用webstorm和Chrome配合，实现实时刷新，使用过webstorm的都知道，自身不需要Ctrl+S进行保存的，这里再结合Live Edit，可以实现一边写代码，一边实时查看。1，第一步因为在webstorm中自带的Live Edit功能是默认关闭的，所以第一步要打开不知道怎么打开的看在下图图片中我的已经打开了，时间单位是毫秒，可以自由修改，我比较懒，所以就没有更改，而且还可以设置只同步HTML和CSS还是HTML和CSS还有js一起同步，这个根据需要自行选择，我在这里选择了三个，在上面还有
2021-01-22 17:49:47
4081
2
原创 JavaScript算法中常用的几种算法
//冒泡排序function bubbleSort(arr) { if (!Array.isArray(arr)) return; const LEN = arr.length; if (LEN <= 1) return; var counter = 0; for (let i = 0; i < LEN - 1; i++) { //外层循环控制趟数，数组长度-1...
2021-01-21 19:34:24
164
原创 在页面显示任意多个球球来回弹，依据移动式广告弹窗改进。
移动式弹窗广告//物体碰边改变方向的方法 function boxMove(ele) { var top = parseInt(getStyles(ele).top);//得到元素的最终的top值 var left = parseInt(getStyles(ele).left);//得到元素的最终left值 var offsetHeight = ele.offsetHeight;//元素自身的高度 var offsetW
2021-01-18 19:30:09
112
原创 JavaScript实现目标在窗体中一直居中显示
使用JavaScript实现目标在窗体中一直居中显示无论如何调整窗体的大小,目标物体都一直会在窗体的中间位置显示//在left,top位置创建一个球 function createDiv(left,top) { var div = document.createElement("div"); var styles = div.style; styles.width='100px'; styles.height='100px';
2021-01-15 12:34:36
337
原创 JavaScript实现两个超大整数的相加的算法，大整数相加. 正常相加会溢出的两个整数,只能使用字符串模拟替代实现。
大整数相加. 正常相加会溢出的两个整数, 以字符串方式相加以前好像见过,应该是一个面试题,忘记了,加数, 字符串, 例 ‘123456789123456789’加数, 字符串, 例 ‘123456789123456789’和,例 ‘1111111111111111110’function addStrings(num1, num2) { var result = '';//定义变量存储结果 var num3=0;//存储每一个位数相加的结果 v
2021-01-14 20:44:53
973
原创 js实现使用鼠标拖动页面元素
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>鼠标拖动元素</title> <link rel="icon" href="../../7952/h1.ico"> <script type="text/javascript" src="../../0js/tool.js"></scri
2021-01-14 19:12:51
612
2
原创 使用按键wasd和上下左右键控制小球上下左右移动
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="js/util.js"></script> <style> * { margin: 0; padding: 0;
2021-01-14 16:04:32
2495
原创 webstorm设置Ctrl+滚轮缩放字体大小
webstorm设置Ctrl+滚轮缩放字体大小1、打开webstorm软件，点击左上角的file2、点击Setting（设置）3、点击Editor4、点击General5、勾选右侧的Change font size (Zoom) with Ctrl+Mouse Wheel6、点击Appay,然后点击OK，回到编辑页面试一下就可以了...
2021-01-14 16:01:57
721
原创 unity2018版 关于打开固定的浏览器并打开固定的网页，同时设置unity窗口显示在最上层
unity 关于打开固定的浏览器并打开固定的网页，同时设置unity窗口显示在最上层最近的项目中需求提到了打开固定的浏览器并且要打开固定的网址，以前虽然使用过，但是和这次的稍微有点不一样的，因为这次的使用是只需要打开浏览器并打开固定的网址就可以了，并不需要显示到unity的上层，但是实际操作中发现，浏览器总是显示在了unity的上面，这个不符合客户需求啊，所以下面是我做了一个小小的更改的简单代码...
2019-01-23 15:55:28
1579
bkhaagjahfmjljalopjnoealnfndnagc.zip
2021-03-24
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人