- 博客(83)
- 收藏
- 关注
RSS订阅
原创 基与uni-app的数据存储部分方法封装的工具类
1.创建Storage.js文件class Storage { // 获取同步storage // 一个参数返回string，两个参数返回一个object getStorage(key) { const argLength = arguments.length console.log(arguments) if(argLength > 1) { const getStorage = {} const arg = Array.apply(null, arguments)
2021-08-31 16:49:45
292
原创 在uni-app中使用promise对uni.request()请求进行封装
1.创建server.js文件export default function service(options) { const path = options.url const baseurl = "https://www.baidu.com" options.url = baseurl + options.url const https = new Promise((resolved, rejected) => { // 同步获取userInfo const use
2021-08-30 15:22:15
533
原创 使用sass遇到的问题总结
1.sass-loder报错TypeError: this.getOptions is not a function原因(1) 在sass-loder8 版本有一次大的升级，之前我们使用~来解决路径引用问题，现在8版本解决掉了这个bug,可以不再依赖～了，随之带来的是配置文件字段发生了改变所导致的。(2) 在sass-loder 到了11版本，需要是 webpack5，我们现有的脚手架基本都是基于 webpack4 进行开发的所导致的更新日志解决方法(1)降低使用版本推荐使用sass-load
2021-07-20 16:33:20
644
原创 使用＜a＞下载文件和压缩文件
1.下载普通文件<a href="./data.txt">Download</a>2.下载压缩文件<a href="./data.rar" download="data.rar">Website</a>download此属性指示浏览器下载 URL 而不是导航到它，因此将提示用户将其保存为本地文件。如果属性有一个值，那么此值将在下载保存过程中作为预填充的文件名（如果用户需要，仍然可以更改文件名）。此属性对允许的值没有限制，但是 / 和 \ 会被转换
2021-07-05 15:28:50
1399
原创 ＜video＞视频使用canvas绘制出来
结合<video>和 <canvas>来实现实时操作视频数据。<!DOCTYPE html><html> <head> <style> body { background: black; color:#CCCCCC; } div { float: left; border :1px solid #444444;
2021-06-25 16:49:56
1712
原创 JS获取并操作iframe中的元素
这里主要就是通过JS来操作Window对象。Window 对象表示浏览器中打开的窗口，如果文档包含框架（frame 或 iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。//获取iframe的window对象// iframeId为iframe标签的idvar newIfram= window.document.getElementById("iframeId").contentWindow;//通过获取到的window对
2021-06-23 10:54:45
5131
1
转载 JS判断视频Video的播放、暂停、结束完成及获取长度事件监听处理
controls:加上这个属性，Gecko 会提供用户控制，允许用户控制视频的播放，包括音量，跨帧，暂停/恢复播放。浏览器并不是都支持相同的视频格式，所以你可以在 <source> 元素里提供多个视频源，然后浏览器将会使用它所支持的第一个源。<video id="video" controls="controls"> <source type="video/mp4" src="mi.mp4"> <source src="myVideo.webm"
2021-06-23 10:45:07
6711
原创 当设置input的placeholder字体大小与input字体大小不一致的时候，placeholder不能垂直居中？
更改前更改后解决方法一通过改变position并设置top解决问题input::placeholder { font-size: 0.7rem; // 更改字体大小 color: #aab2bd; // 更改字体颜色 position: relative; top:-0.1rem%;}二（这里只提供一个思路）一点击输入框，触发一个change事件，修改 input框的class。失去焦点如果内容为空，则class又改回来...
2021-06-17 10:56:05
1186
转载 vue项目白屏的原因及优化
一、原因：单页面应用的 html 是靠 js 生成，因为首屏需要加载很大的js文件(app.js 和vendor.js)，所以当网速差的时候会产生一定程度的白屏二、解决办法：1、路由懒加载，组件懒加载1.路由懒加载// 1、Vue异步组件技术：{ path: '/home', name: 'Home', component: resolve => require(['../views/home.vue'], resolve)}// 2、es6提案的import(){
2021-05-24 16:47:32
3281
原创 Nuxt.js报错：Classic mode for store/ is deprecated and will be removed in Nuxt 3解决方法
将Nuxt.js升级到最新版的2.4.0时，终端提示警告：出现这个的原因是 vuex经典模式写法将在Nuxt 3中删除 if (typeof store === 'function') { const log = (process.server ? require('consola') : console) return log.warn('Classic mode for store/ is deprecated and will be removed in Nuxt 3.')
2021-05-24 10:44:08
714
原创 ✖ 1 problem (1 error, 0 warnings) 1 error and 0 warnings potentially fixable with the `--fix` opti
只需要在代码最后一行加一个空行即可。
2021-05-24 10:29:22
5658
原创 修改gitignore 文件中忽略项不起作用的解决方法
新建或者已近有的文件在git本地仓库中会有缓存，如果某些文件已经被纳入了版本管理中，就算是在.gitignore中已经声明了忽略路径也是不起作用的，这时候我们就应该先把本地缓存删除，然后再进行git的push，这样就不会出现忽略的文件了。git清除本地缓存命令如下：git rm -r --cached .git add .git commit -m 'update .gitignore'git push -u origin master...
2021-05-24 09:27:32
242
转载 基于http-server快速搭建本地服务
在现在前后端分离的模式下，打包后的测试文件总要放到服务器才会正常运行，现在使用http-server即可快速在本地搭建服务，运行打包后的测试文件。1.环境搭建http-server 基于node运行，需要安装nodeJs环境，2.安装http-server全局安装：npm install --global http-server3.运行本地服务打开cmd，移动进入当前文件夹的上一次层文件，在当前文件夹内输入命令即可http-server [path] [options] -c -1path默
2021-04-19 11:39:13
479
原创 看javascript高级程序设计第四版对类class的总结
类(class)类是ECMAScript中新的基础性语法糖结构，为了解决继承问题，它背后使用的仍然是原型和构造函数的概念。1.类定义// 类声明calss preson {}// 类表达式const preson = class {}与函数表达式类似，类表达式在他们被求值之前不能被引用。但是声明式函数可以提升，类不可以提升// 函数表达式console.log(functionExpression); // undefiendvar functionExpression = funct
2021-04-14 17:21:39
268
转载 vue-cli中打包后，页面空白，路径错误.
在vue项目中，打包后出现这个问题，仔细一看原来是路径问题。解决方法：在项目中添加vue.config.js文件，内容如下：1.在vue-cli.3.3版本之前module.exports = { baseUrl: process.env.NODE_ENV === 'production' ? './' : '/' }2.在vue-cli.3.3版本后 baseUrl被废除了，因此这边要写成 publicPathmodule.exports = { publicP.
2021-04-06 17:15:22
277
原创 vue插件
1.axios作用：基于Promise的HTTP客户端，用于浏览器和node.jsnpm: axiosgithub: https://github.com/axios/axios例子：https://blog.csdn.net/weixin_45932733/article/details/1090293162.SheetJS作用：用于各种电子表格格式的解析器和编写器。作者用来解析.xlsx文件npm: sheetjsgithub: https://github.com/SheetJS/sh
2021-04-06 10:09:12
101
转载 j分数组去重常用方法方法
1.利用ES6 Set去重无法去掉空{}var person = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}]function quchong (arr) { return Array.from(new Set(arr)) //Array.from方法从一个类似数组或可迭代对象创建一个新的，浅拷贝的数组实例。
2021-04-02 16:25:57
134
原创 通过SheetJS解析本地.xlsx文件，并上传数据
HTML(本项目使用vue)<div class="button"> 选择文件 <input type="file" id="file" @change="change"></div><div class="file "> 选择的文件：{{xlsName}}</div>JSchange(e) { this.xlsName = e.target.files[0].name const files =
2021-04-01 10:44:35
884
原创 文件上传按钮的样式
原声文件上传按钮样式比较简单不太好看，而且貌似不可修改，所以自己便使用CSS透明度的方法给它改造，代码如下本次项目使用的是vue，所以{{xlsName}}是自己通过Change方法获取e.target.files[0].name来赋值的若是原生js可以通过var xlsName = document.getElementById("file").files[0].name来取得上传文件的名字演示样式HTML<div class="button"> 选择文件 <input
2021-04-01 10:31:31
1101
转载 js运算符功能和运算规则
+(加号)功能：1、对数字进行代数求和2、对字符串进行连接操作3、将一个数值转换成字符串字符串运算：字符串+字符串—两者直接拼接字符串+数值—数值转为字符串再拼接如果有一个操作数是对象、数值或布尔值，则调用它们的 toString() 方法取得相应的字符串值，然后再应用前面关于字符串的规则。例子：var a = '123', b = 1， c = 2, d = {'my'}console.log(a + b) // '1231'// 多次运算如果数值和字符串一起混，数值类型的用
2021-03-24 12:34:50
607
转载 js如何方便的展示base64二进制流图片文件
base64简单地说，它把一些 8-bit 数据翻译成标准 ASCII 字符Data URI schemeData URI scheme是在RFC2397中定义的，目的是将一些小的数据，直接嵌入到网页中，从而不用再从外部文件载入。所以我们就可以用如下方法直接显示base64二进制流文件在下面演示中，data表示取得数据的协定名称，image/gif是数据类型名称，base64 是数据的编码方法，逗号后面就是这个image/gif文件base64编码后的数据。<img src=“data:i
2021-03-23 17:57:49
3261
转载 Markdown常见用法
一级标题使用 # 一级标题 // #后面有空格，类似，几个#就是几级标题段落段落的换行是使用两个以上空格加上回车，或者也可以使用空行来换行。字体*斜体文本*_斜体文本_**粗体文本**__粗体文本__***粗斜体文本***___粗斜体文本___分隔线**** * ******- - -----------删除线~~BAIDU.COM~~下划线<u>带下划线文本</u>7.注脚一个具有注脚的文本。[^1.
2021-03-22 10:53:11
79
原创 在js中动态添加标签并绑定事件给事件动态传餐问题解决方案
最近在开发时遇到一个棘手问题，就是在js里循环的插入标签组，想要给里面的按钮添加绑定事件，并动态的传递参数，不管我怎么写就是获取不到当前标签组的 i ，然后就找到以下两种方法用作记录。第一种传递一个参数 let abc = '<a οnclick=subButton(\''+data.index+'\')><i class="fa fa-cloud-upload"></i>删除</a>'第二种()传递多个参数let abc = '<a ο
2021-03-16 11:32:27
332
原创 js删除对象属性的方法
const obj = {abc: '1', bcs: '5', fas: '6'}delete obj.abcconsone.log(obj) // {bcs: '5', fas: '6'}
2021-03-10 11:14:26
803
原创 解决element-ui输入框无法输入的问题
1.在data中定义的变量必须要有初始值，且不能为Null（作者本人就是这个问题导致编辑时，输入框无法输入）2.在网上也出现很多这种回答，就是给他添加一个@input事件@input事件可以拿到输入的值，然后使用this.$forceUpdate() 方法更新视图即可...
2021-02-07 10:26:43
3525
原创 后台返回两个相同数组其中一个包含另一个，去掉重复的项，返回一个不重复的新数组
options包含Childrenvar Children = [{},{},{}]var options = [{},{},{},{},{}]function duplicates(options, Children) { function ischongfu(element) { const optionsEL = element let number = 0 // 这里的ID代表的两个数组中的对象某一个属性。 Children.forEach((elements) =&
2021-01-28 18:20:10
337
转载 CSS重绘与重排(回流)
重绘（repaint或redraw）当盒子的位置、大小以及其他属性，例如颜色、字体大小等都确定下来之后，浏览器便把这些原色都按照各自的特性绘制一遍，将内容呈现在页面上。重绘是指一个元素外观的改变所触发的浏览器行为，浏览器会根据元素的新属性重新绘制，使元素呈现新的外观。重排（重构/回流/reflow）当渲染树中的一部分(或全部)因为元素的规模尺寸，布局，隐藏等改变而需要重新构建, 这就称为回流(reflow)。每个页面至少需要一次回流，就是在页面第一次加载的时候。重绘和重排的关系在回流的时候，浏览器
2021-01-28 11:42:20
303
原创 使用git开发或多人开发，创建，删除，合并与解决冲突
在实际开发中，我们应该按照几个基本原则进行分支管理：首先，master分支应该是非常稳定的，也就是仅用来发布新版本，平时不能在上面干活；那在哪干活呢？干活都在dev分支上，也就是说，dev分支是不稳定的，到某个时候，比如1.0版本发布时，再把dev分支合并到master上，在master分支发布1.0版本；你和你的小伙伴们每个人都在dev分支上干活，每个人都有自己的分支，时不时地往dev分支上合并就可以了。所以，团队合作的分支看起来就像这样：1.查看分支// 下面带星号的为当前分支 git b
2021-01-26 11:57:00
1193
原创 git在windows的安装和关联远程仓库的基本使用，并解决vscode终端无法使用命令
安装（windows）1.官网下载对应的版本，然后按默认选项安装即可。安装完成后，在开始菜单里找到“Git”->“Git Bash”，蹦出一个类似命令行窗口的东西，就说明Git安装成功！2.修改全局配置，在命令窗口或者Git Bash里都可以// 双引号里填入你的信息，name中英文都可以git config --global user.name ""git config --global user.email ""3.创建git仓库（就是创建一个目录），或者使用已经有的项目目录，并把他
2021-01-25 18:06:32
724
原创 关于elementui表格formatter列格式化内容展示，顺带处理表格不能显示布尔值的问题。
最近在做后台管理项目，遇到了后台传给我的数据，其中有一些数据并不能直接展示在表格中，需要做进一步处理，当然如果不嫌麻烦，自己拿来数据一条条进行处理也可以，但我是本着能少写就不写的原则，去elementui官网去搜索了一番，就找到了解决方案，那就是formatter这个参数，是专门用来处理展示内容的，用法如下这个例子也顺带处理了，表格不展示布尔值的问题。// html代码<el-table-column prop="Registrationstate" :formatter = "form
2021-01-13 10:30:49
2233
原创 手写一个简单易懂的new
1.正常使用newfunction Xue(name){ this.name = name}Xue.prototype.sayName = function(){ console.log(this.name)}var xue = new Xue('我是Xue')Xue.sayName() // 我是Xuexue.sayName() // 我是Xue2.自己手写一个mynewfunction Xue(name){ this.name = name}Xue.pro
2020-12-22 18:02:57
249
2
原创 清空定时器，赋值为null的区别以及返回值和传参
1.定时器的返回值定时器是有返回值的，返回值代表着是第几个定时器，类型是number类型，也可以用来取消定时器，它是定时器的唯一标识符，当然你也可以把这个值赋值给一个变量，这个就是我们经常用来清除定时器的方法。var nums = 1; function fn() { // 这里你也可以用setInterval let timer = setTimeout(function () { console.log(nums); console.log(time
2020-12-22 17:14:24
1849
2
原创 手写防抖与节流，及其实现原理
防抖（小括号里为说明）在规定的时间（wait）内执行被调函数（fn），当高速被调用时（小与规定时间），重新开始计算时间（wait），直至在规定时间（wait）内没有再次被调用时，或者最后一次调用时，才真正的执行被调函数。function debounce(fn,wait){ let timer; return function(){ let context = this; let args = arguments; clearTimeout(timer) time
2020-12-22 16:31:00
633
原创 Vue组件通信中event-bus的使用
1.最近再写一个后台管理项目，本着能白嫖就不动手的目的，就去GitHub上面整了个项目模版。由于刚入行不久，决定先研究人家代码，方便自己后续添加功能啥的，于是就发现了eventBus这个东西。2.eventBus又叫事件总线，可以看作是用来传递数据的桥梁，在一些比较小的项目中就可以使用它来替代vuex。3.使用方法1.创建一个bus.js的文件夹，里面代码如下import Vue 'vue'export defulat new Vue()2.在传递组件中引入bus.js文件并在相应的位置传递变
2020-12-08 15:40:28
734
3
原创 解决vue-router跳转重复路径报错问题
在最近写代码时发现，我的路由跳转重复路径后，报错如下,问题可能是官方当前版本问题，所以解决方案如下let path = this.$route.pathlet newpath = "/home"if (path ==!newpath) { this.$router.push(newpath)}Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/home".
2020-12-02 22:29:02
3033
原创 vue路由跳转的方式与传递参数
1.用<router-link>创建路由跳转默认情况下与<a>标签效果相同to为需要跳转到的位置例子// 1.to可以为一个字符串<router-link to="home">Home</router-link>// 2.也可动态的绑定一个变量字符串<router-link v-bind:to="'home'">Home</router-link>// 3.动态绑定一个对象<router-link :to="
2020-12-02 12:14:38
215
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人