- 博客(32)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 2021前端面试经
the first 论被离职的无奈跟往常一样乐乐呵呵的上班，突然间被通知办公地点要搬到几十公里外的新办公区(仅仅是外包同学)，听到这个不幸的消息心里哇凉哇凉的。这可咋办呢？前一个月闲的无聊投过一些简历，结果面试反馈是基础不行。害离搬地方还有半个月时间，真的是时间紧任务重呀。顿时觉得压力山大，本身工作乐乐呵呵该上班上班该下班下班，leader都明确表示让我再找工作机会了，没办法上号吧！上号（BOSS直聘）对于没有学历的我,流下了没学历的泪水。对于投简历的策略我采取的是广撒网政策哈哈哈，无论是外包还是
2021-09-28 14:41:07
1736
原创 填坑之dva-cli创建项目更改antd主题色
以下是antd官方文档更改theme的教程https://2x.ant.design/docs/react/customize-theme-cn项目中需要统一主题色可是antd默认的是蓝色(汗颜),那可怎么办呀，本以为会特别简单，不就是在package.json中加个值么，so easy!重启n遍之后感觉事情远没有想象中那么简单，不知道出来啥问题，于是乎就去找之前的项目，引用方法都一样，可就是出不来。挠头ing看了很多篇有一样问题的博客，总结出来两种不可靠的方法：1.修改.webpac.
2021-09-22 16:01:15
363
原创 如何判断js对象是否存在某个属性？
判断js对象是否存在某个属性其实有很多方法，选择哪种方法很大程度上看我们的实际业务场景了。下面总结了日常使用的几种方法。1.hasOwnProperty()const obj = {a: 1, b: 2};obj.hasOwnProperty('a'); // trueobj.hasOwnProperty('c'); // false2.使用undefined判断// 该方法存在一个问题，如果属性的值就是undefined的话，该方法不能返回想要的结果const obj = {a:
2021-08-23 17:40:57
1052
原创 当vue3不再支持IE
JavaScript 中的所有事物都是对象：字符串、数值、数组、函数...此外，JavaScript 允许自定义对象。Object.assign()
2021-07-09 11:12:24
3878
4
原创 满满干货之前端RSA长文本加密(vue项目)
最近做的项目中，涉及到了密码加密传输，可是刚好不凑巧的是密码没有长度限制，烦skr人了。关于50位以下的rsa加密可以直接使用jsencrypt实现。还是先记录下jsencrypt的使用吧。第一步当然是安装了npminstalljsencrypt如何使用？随意一个.vue文件// 首先引入jsencryptimport JSEncrypt from 'jsencrypt';// 1.初始化const encrypt = new JSEncrypt({});const ...
2021-06-28 19:02:27
1729
8
原创 js Object常用方法
JavaScript 中的所有事物都是对象：字符串、数值、数组、函数…此外，JavaScript 允许自定义对象。Object.assign()Object.assign方法用于将所有可枚举属性的值从一个或多个源对象分配到目标对象。它将返回目标对象。常用于数据深拷贝语法： Object.assign(target, …sources)// 复制一个对象const tar = {a: 1, b: 2};const res = Object.assign({}, tar);console.l.
2021-05-06 16:10:49
151
原创 js 运算符和表达式整理
一元运算符一元运算符只有一个操作数+// 相加运算符 (+) 用于对两个操作数进行相加运算，如果操作数为字符串则该运算符将两个操作数连接成一个字符串// 注: '+'两侧只要有一侧是字符串，另一侧的数字则会自动转换成字符串，因为其中存在隐式转换1 + 1 = 2 // number + number = number1 + false = 1 // number + boolean = number 1 + 'hi' = '1hi' // number + string = string-
2021-04-27 16:37:51
428
原创 简单使用markdown
最近接了一个整理doc的工作，说白了就是文章的搬运工。目的网站只能使用markdown，but本人之前没有用到过markdown，刚开始下手有点积累。下面记录一下日常的markdown语法一、什么是markdownMarkdown是一种轻量级标记语言，创始人为约翰·格鲁伯（英语：John Gruber）。 它允许人们使用易读易写的纯文本格式编写文档，然后转换成有效的XHTML（或者HTML）文档。这种语言吸收了很多在电子邮件中已有的纯文本标记的特性。由于Markdown的轻量化、易读易写特性，并且对
2021-04-25 16:09:58
142
原创 vue3 自定义指令-按钮防连击
除了核心功能默认的内置指令(例如v-model，v-if，v-show)，vue也允许注册自定义指令。初次使用vue3，相对于vue2的小差异难免有些小不适应。针对于项目中需要的按钮防连击自定义了一个指定。记录一下~首先我们需要了解的是vue2跟vue3中钩子函数的不同2.x语法bind - 指令绑定到元素后发生。只发生一次。inserted - 元素插入父 DOM 后发生。update - 当元素更新，但子元素尚未更新时，将调用此钩子。componentUpdated - 一旦组件和子级被更新
2021-04-16 14:30:03
709
原创 moment.js日常使用总结
moment.js是一个JavaScript 日期处理类库，用于解析、检验、操作、以及显示日期。目录安装显示1.获取当前日期解析1.format()将日期(时间)转换为指定格式（常用）2.fromNow()时间间隔(相对时间)3.toNow()时间间隔(相对时间)操作1.add()增加时间2.subtract()减去时间3.startOf()设置为时间单位的开头4.endOf()设置为时间单位的末尾（同上）校验1.isBefore(): 一...
2021-04-06 14:01:21
1720
原创 vue3注册组件的方式
在思否问答区看到一个这样的问题发布于3月7日，浏览量几百但是没有一个人回答，难道是问题太low？哈哈哈哈。总的来说这个问题出现的原因就是非要使用vue2的语法来运行vue3的东西，他不配套呀！！还有些同学在vue3中使用export default来导出，捂脸笑~以下是vue3中注册组件的用法：使用defineComponentdefineComponent// 全局注册main.jsimport { createApp } from 'vue';import ComA fr.
2021-03-29 14:56:29
12801
原创 5分钟教你搞定瀑布流样式
首先，我们来讲一下什么是瀑布流嘞？在某些个以图片为主的网站中，单一的布局那什么来吸引眼球，当然是尽量炫酷的布局了。瀑布流又称瀑布流式布局，是现在流行的一种布局方式。知道了这些，那瀑布流布局实现的原理是什么呢？关于瀑布流算法此时，可以放在第一行的图片已经就绪，分别为图片1234，这时候第一行已经放满，5号图片需要找到合适自己的位置，我们很清楚的看到，2号下面最最合适了，所以5号就登场啦6号7号...都会依次找到属于自己的位置知道它是怎么回事儿之后，我们转换成代码看下（vue..
2021-03-22 16:01:03
1496
原创 你不知道的vue3异步组件
vue官网对于defineAsyncComponent的定义：defineAsyncComponent 创建一个只有在需要时才会加载的异步组件基本用法：// defineAsyncComponent 可以接受一个返回 Promise 的工厂函数。Promise 的 resolve 回调应该在服务端返回组件定义后被调用。你也可以调用 reject(reason) 来表示加载失败import { defineAsyncComponent } from 'vue'const Async.
2021-03-15 18:02:36
1745
原创 css伪类-小圆点
项目需求：在每个单元格的前面加一个小圆点，效果图如下：搜了一大堆文章，加小圆点的方法无非就是设置width、height、border-raduis。可是来来回回试了好多遍，就是样式加不上，汗颜~偶然间看一大神说必须加上display:inline-block;才会生效，我的天呐，不会是真的吧。对，就是这个样子滴，附上完整的代码，可随意ctrl c+v<!--html--><div class="headers"> <div class="heade
2021-03-12 18:27:43
3565
3
原创 yield关键字
MDN关于yield关键字的解释：Theyieldkeyword is used to pause and resume a generator function (function*orlegacy generator function). // yield关键字用来暂停和恢复一个生成器函数（(function*或遗留的生成器函数）。yield是个啥？首先，先确定一下，yield是个关键字，注意它不是一个函数。yield跟var、let关键字声明不同，它有点儿类似于ret...
2020-12-28 15:31:16
1692
原创 vue+typescript之vue-property-decorator使用
the first,安装npm i vue-property-decorator1.@Prop// js写法export default { props: { propertyA: string, propertyB: { type: Boolean, default: () {return false;} } }}// ts写法import {Vue, Prop, C
2020-11-04 17:38:49
1163
原创 Typescript+vue实战
一、基础类型1.布尔值const hasData: boolean = false;2.字符串const name: string = 'ysj';3.数字const age: number = 22;4.数组const arr1: Array<number>= [1, 2, 3, 4];interface ArrList { name!: string; age?: number;}const arr2: ArrList[] =...
2020-11-02 17:46:26
3156
2
原创 Vue组件封装
我个人认为，前端开发过程中，要遵循的一点原则就是万物皆可封。就比如一个项目中，十个页面有九个都会用到Table表格，这时候PM突然给你发了句，在么？恭喜你，今天准点下班是实现不了了。一个小小的改动，同样的操作你就必须去ctrl+c，ctrl+v假如你刚开始的时候，就把table封装成一个组件，然后多次调用，这时候可能一句代码就可以搞定PM，是不是爽歪歪这时候你会问了，组件是什么？组件（Component）是 Vue.js 最强大的功能之一。组件可以扩展 HTML 元素，封装可重用...
2020-09-24 18:48:57
489
1
原创 Vue过滤器 filter
这是什么？filter过滤器，顾名思义就是一个数据经过了这个过滤之后产出另外一个东西。就比如一个时间戳经过过滤之后给我产出一个（2020-09-14 15:54:54）这种格式的数据怎么定义？方法有二注意：全局注册时是filter，组件内部是filters。filter跟filters用错虽然不会报错，但是不会去过滤数据1.组件内filters: { capitalize: function (value) { if (!value) return '' value
2020-09-14 16:08:27
704
原创 什么是前端工程化？
前端工程化体系是一种服务，以项目迭代工程中的前端开发为主要服务对象，设计开发、构建、部署等环节。--《前端工程化：体系设计与实战》前端工程师技能？硬技能：Html+Css+Javascript。--这三项是前端工程师硬核中的硬核-- 软技能：交互+优化。能够真正提现工程师水平的东西。为什么有些人做出来的交互会让人狠舒服并且一顿操作只喊六六六呢？ 扩展：Node.js。不得不说，在这个大前端时代，前能画图，后能搞服务。一条流水线跑下来你能更好的写出逻辑性完美的代码工程化衡量准则前端工.
2020-08-20 19:18:36
1841
原创 2020前端面试题--css
漫漫前端路~~~，话不多说上题1.元素水平垂直居中<html><body><div> <div class="parent"> <div class="son"></div> </div></div></body></html>1.绝对定位+top+right+margin-left+margin-top.parent { ...
2020-08-10 16:21:52
934
原创 自动加载路由-webpack require.context
vue项目中，每添加一个模块都需要去引入并注册到路由表中，webpack中的require.context这个API将会解决这个问题，大大提升了我们的工作效率。不妨去看看我们的路由表，三四个模块就需要200行以上的代码量，而且我增加一个模块就需要再次注册一遍，冗余的代码太多太多了。首先，我们来看看require.context是什么？？？一个webpack的api,通过执行require.context函数获取一个特定的上下文,主要用来实现自动化导入模块,在前端工程中,如果遇到从一个文件夹引入
2020-08-07 19:19:40
1999
原创 vue实现元素快速定位
需求：一个列表中有可能会有N多条数据，我在选择一个item查看详情的情况下。如果上下滚动想要再次找到这个位置的时候可能会很麻烦了，需要滚动滚动再滚动。所以，就需要一个悬浮的上下箭头去快速定位到刚才的位置。以下是我做的效果~~~...
2020-06-12 15:31:34
4850
原创 新建远程空分支
目录1.远程主分支克隆至本地2.创建并切换新分支3.清理本地分支4.创建空的commit5.推送新分支1.远程主分支克隆至本地2.创建并切换新分支git branch 分支名git checkout 分支名3.清理本地分支git rm --cached -r .git clean -f -d4.创建空的commitgit commit --allow-empty -m "新分支初始化"5.推送新分支git push...
2020-05-19 19:49:18
1187
原创 把带点的字符串转换为json对应的key，并赋值
本次需要：后端给返回来一个字符串来代表对象的对象的对象key，好苦恼。类似于item = "a.b.c.d"然后我需要转换为a: {b:{c:{d:1}}}这种形式的数据。解决方案：eval函数（虽然尽量不要用这个函数，可是目前实在没有找到更好的方法了哈哈）let obj = { a: { b: { c: { ...
2019-12-11 20:46:50
559
原创 vue实现 上传并读取文件
需求：用户要求上传.sql文件并解析实现结果：可上传多个文件，点击可在下方查看，可删除所用知识点：FileReader读取文件FileReader官方可用四种方法读取文件。分别为readAsArrayBuffer(此方法用来将文件存储为二进制数据)、readAsBinaryString(此方法将文件存储为二进制，已废除用readAsArrayBuffer来代替)、readAsD...
2019-12-05 21:18:37
5124
1
原创 vue codemirror设置高度
问题所在：使用codemirror的时候，组件设置了固定高度300px，在线下应用的时候，往往不符合自己的需求按照官方文档来说，将height设置为auto即可，可是你会发现这个样式怎么都应用不上去解决方案：在外层套一个div，给该元素设置高度亲测有效哦！！！...
2019-11-22 14:41:19
7286
1
原创 npm run dev启动失败问题
npm ERR! code ELIFECYCLEnpm ERR! errno 1npm ERR! my-project@1.0.0 dev: `webpack-dev-server --inline --progress --config build/webpack.dev.conf.js`npm ERR! Exit status 1npm ERR!npm ERR! Failed at ...
2019-08-08 15:59:42
5289
2
原创 JavaScript中的this指向总结
1.普通函数中this指向window function fn(){ console.log(this); }; fn();//输出window对象2.构造函数中this指向新创建的对象 let Student=function(){ this.name='张三' } let stu1=new Student(); ...
2019-05-17 14:55:12
217
原创 CSS3动画实现旋转魔方
<!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-...
2019-03-23 18:07:41
548
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人