- 博客(155)
- 收藏
- 关注
RSS订阅
原创 前端面试题汇总集合（初级）
前端面试题整理面试目录$HTML， HTTP，web综合问题1、前端需要注意哪些 SEO2、 的 title 和 alt 有什么区别3、 HTTP 的几种请求方法用途4、从浏览器地址栏输入 url 到显示页面的步骤5、如何进行网站性能优化6、HTTP状态码及其含义7、语义化的理解8、介绍一下你对浏览器内核的理解9、 html5 有哪些新特性、移除了那些元素？10、 HTML5 的离线储存怎么使用，工作原理能不能解释一下？11、浏览器是怎么对 HTML5 的离线储存资源进行管理和
2020-06-29 14:06:00
18426
原创 vue3+antdv 表格封装
tool.ts/**生成唯一ID */let _idCounter = 0;export function generateUniqueID() { var ts = new Date().getTime().toString(); var parts = ts.split("").reverse(); var id = ""; for (var i = 0; i < 5; ++i) { var index = Math.floor(Math.random() * pa
2023-11-06 14:27:23
314
原创 vue3 自定义loading
使用antdv 后发现只有button支持loaidng属性，而其他元素不能使用loading来显示是否加载中，需要套一层 a-spin 才能支持，非常不方便。在新建个loading.ts 用来注册v-loading 相关操作。在页面中就可以直接进行v-loading 进行使用了。新建loading.vue文件用来页面显示。所以写了个自定义的指令来进行处理。最后在main.ts 进行注册。
2023-11-06 14:18:22
349
原创 vue结合el-dialog 封装自己的confirm二次确认弹窗
首先在components 添加 ConfirmAlert文件夹 然后添加vue和js 文件。这里使用el-dialog 主要是用他的关闭动画，让关闭更加丝滑。main.js将alertConfirm挂载vue上。
2023-02-03 10:42:02
28673
原创 el-table结合el-popover使用通过ref的方式控制显示隐藏
【代码】el-table结合el-popover使用通过ref的方式控制显示隐藏。
2023-01-17 11:14:43
50678
原创 vscode 提示@/文件目录
在当前项目的根目录下新增一个jsconfig.json文件，文件内容如下。这样在其他页面输入@/就会提示相关目录下的文件了。
2023-01-05 10:39:17
251
原创 vue双向数据绑定原理
第四步MVVM作为数据绑定的入口，整合Observe和Compile和Watcher三者，通过Observe来监听自身的model数据变化，通过Compile来解析模板指令，最终利用Watcher搭起两者之间通信的桥梁，达到数据变化->视图更新；视图交互变化（input）->数据model变更的双向绑定效果。第二步compile解析模板指令，将模板中的变量替换成数据，然后初始化渲染页面视图，并将每个指令对应的节点绑定更新函数，添加监听数据的订阅者，一旦数据有变动，收到通知，更新视图。...
2022-07-20 13:59:24
119
原创 xlsx 导出导入excel，xlsx-style 修改excel样式
首先npm下载两个依赖还需要下载一个浏览器文件下载依赖引入xlsx-style会产生报错，需要在vue.config.js配置下vue.config.jsexcel.jsxlsxStyle.utils
2022-07-01 15:09:43
124169
1
原创 element textarea摁住回车换行不生效
这里主要是使用trim 过滤器.trim 自动过滤输入内容最开始 和 最后的 空格，中间的会保留一个空格，多的会被过滤掉。当我摁住回车的时候产生的空格就被过滤掉了，然后输入框获取到的就是空格的值，就产生不了换行这里我们去掉.trim 就可以进行换行了...
2022-06-29 15:50:53
1907
2
原创 vue滚动页面第一次不生效需要点击第二次才生效
把 document.documentElement.scrollTop = Math.min(scrollTop,document.documentElement.maxScrollTop);卸载nexttick 回调里就行了
2022-06-29 15:46:05
1750
原创 vue自定义指令
这个指令可以给组件绑定一个或多个快捷键。通过按下 Escape 键后隐藏某个组件，按住 Control 和回车键再显示它。安装main.js 注册页面使用Vue-Lazyload图片懒加载，非常方便。安装main.js页面使用V-Tooltip几乎每个项目都会用到 tooltip。这个指令可以给元素添加响应式的tooltip，并可控制显示位置、触发方式和监听事件。安装main.js页面使用V-Blur为绑定的内容蒙上阴影安装main,js页面使用Vue-D
2022-06-16 17:50:09
90
原创 照片反转1
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do
2022-05-31 16:51:27
45
原创 数组递归求和
const sum = (numbers) => { const fn = (i) => { return i >= numbers.length ? 0 : numbers[i] + fn(i + 1) } return fn(0) }
2022-05-30 14:00:56
58
原创 表白墙（待更新）
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <div class="container"> <!-- 设置标题--> <h1> 表白墙</h1>
2022-05-30 10:42:20
50
原创 yyyy-MM-dd HH:MM:SS
/** * 获取当前时间 格式：yyyy-MM-dd HH:MM:SS */ function getCurrentTime() { var date = new Date(); //当前时间 var month = zeroFill(date.getMonth() + 1); //月 var day = zeroFill(date.getDate()); //日
2022-05-30 09:30:01
62
原创 利用IntersectionObserver监听图片是否在当前视窗内
created() { let options = { root: null, rootMargin: "0px", threshold: [0, 0.8], }; this.intersectionObserver = new window.IntersectionObserver((entries) => { entries.forEach((entry) => { if (entry.target ==
2022-05-20 11:43:22
270
原创 vue自定义指令
/*eslint-disable*/import {classOf} from "./common";export default (Vue)=>{ Vue.directive('justify-width',{ bind(element){ element._$loadWidthHandler = (event)=>{ let img = event.target; img.s
2022-05-19 16:28:02
469
原创 video相关
<video autoplay muted class="video" @click="videoClick" loop v-element-init="initVideoElement" > <source :src="mediaSrc" type="video/mp4" v-element-init="initSourceElement" /></video>
2022-05-19 14:09:42
56
原创 设备适配js
var STANDARD_WIDTH = 1920;//px ; 按1920宽的屏幕来适配var MAX_AVAILABLE_WIDTH = 1920;//px ;最大的适配宽度，超过这个宽度，也按1920处理var ROOT_FONT_SIZE = 16;//px ; font root size 默认为16px,和浏览器一致，方便项目中设置样式window.screenSizeChangeTimeout = 0;window.addEventListener('resize',function
2022-05-19 14:07:25
97
原创 设备适配js
var STANDARD_WIDTH = 1920;//px ; 按1920宽的屏幕来适配var MAX_AVAILABLE_WIDTH = 1920;//px ;最大的适配宽度，超过这个宽度，也按1920处理var ROOT_FONT_SIZE = 16;//px ; font root size 默认为16px,和浏览器一致，方便项目中设置样式window.screenSizeChangeTimeout = 0;window.addEventListener('resize',function
2022-05-18 09:51:03
109
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人