- 博客(30)
- 收藏
- 关注
原创 js坐标的相关属性
表示事件发生时,鼠标指针相对于浏览器窗口可视区域左上角的水平和垂直坐标,不考虑页面滚动的影响。表示事件发生时,鼠标指针相对于整个文档(包含滚动部分)左上角的水平和垂直坐标。表示事件发生时,鼠标指针相对于用户屏幕左上角的水平和垂直坐标。表示事件发生时,鼠标指针相对于触发事件的元素(目标元素)左上角的水平和垂直坐标。:这是元素的一个方法,会返回一个包含元素的大小及其相对于浏览器窗口可视区域位置的对象。该对象包含 、、、、 和 属性。
2025-03-31 22:04:43
275
原创 前端如何实现生成excel文件,并下载
后端很忙没有实现配合,主要由前端来实现,需要点击下载模版生成一个excel并下载的功能,另外如果数据是json格式,这里没有用到。上传文件后,前端读取上传的excel。也可以多列数据,这个暂时用不到。
2025-03-14 17:51:05
468
原创 vue3:Suspense的作用
它让我们可以在组件树上层等待下层的多个嵌套异步依赖项解析完成,并可以在等待时渲染一个加载状态。通俗来讲就是用来处理异步组件加载时的 loading 状态的,等待组件异步加载,加载完成后统一显示。一般组件中获取接口数据,使用v-if和v-else控制loading,当接口返回后把loading设为false,但是当页面接口过多时,到处都是 loading,为了协调整个页面的加载状态,这里有一个深度嵌套的组件,它需要整整5秒来加载,阻塞了整个UI,尽管大多数组件加载完成的时间要早得多。另外,这些组件都通常与。
2024-07-30 10:36:34
381
原创 window.matchMedia
matchMedia() 返回一个新的 MediaQueryList 对象,表示指定的媒体查询字符串解析后的结果。
2024-07-09 22:23:31
349
原创 ResizeObserver和IntersectionObserver
ResizeObserver是监听DOM元素宽高的变化,需要注意的一点就是监听出变化结果是contentBox的宽度和高度。IntersectionObserver 是监听DOM元素是否可见。用于监听元素大小的变化。
2024-07-01 10:23:11
211
原创 qiankun微前端:qiankun+vite+vue3+ts
微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略。
2024-06-28 14:10:38
594
2
原创 fatal: detected dubious ownership in repository at ‘xxx‘
【代码】fatal: detected dubious ownership in repository at ‘xxx‘
2023-05-15 11:50:08
340
转载 如何搭建一个组件库
自动创建 packages文件夹和lerna.json和package.json。App.vue和template.html里面就写了最基本的格式这里不再赘述。新建site/webpack.config.js。新建index.ts和button.vue。12.新建babel.config.js。删除无关的文件,新建index.ts。在package.json下补充。创建tsconfig.json。在package.json下添加。在lerna.json下补充。
2023-04-17 13:52:11
291
2
原创 vue-property-decorator
是依赖于ts的一个装饰库,用来简化书写npmvue-property-decorator是vue-class-component的进一步封装,提供了 写法template和css写法不变,只是在script上加上lang='ts':script声明当前语言是ts@Component:注明此类为一个vue组件 export default class Test extends Vue:当前组件类继承vue生命周期 方法 组件 watch 计算属性对于V
2023-04-14 13:11:25
434
原创 electron
ready:当Electron完成时被触发window-all-closed:所有窗口被关闭时触发before-quit:在窗口关闭之前触发will-quit:在所有窗口都已经关闭并且应用程序将要退出quit:退出之前。
2023-04-14 12:57:44
350
原创 【electron】-This renderer process has “webSecurity“ disabled. This exposes users of this app to sever
原因:有跨域请求在主进程里添加了webSecurity:false,控制台出现如下警告⚠️。
2023-04-14 12:42:15
1320
原创 vue resolveDynamicComponent的使用
这几个组件里的内容写在对应的views的component文件夹下。使用resolveDynamicComponent动态解析组件。遇到这种情况,每个卡片的布局一致,只有内容不一致。组件注册在global或者在main.ts里导入。对应的ts写出对应的标题和详情页配置。
2023-04-14 12:31:44
675
原创 打开一个页面,数据是接口轮询返回的,还可以修改属性,如何在编辑时暂停轮询
使用 @vueuse/core封装的方法,传递一个函数,监听一个boolean值。
2023-04-14 11:53:18
121
原创 什么是闭包
换而言之,闭包让开发者可以从内部函数访问外部函数的作用域。在 JavaScript 中,闭包会随着函数的创建而被同时创建。如果不是特定的需要应该尽量减少使用闭包,闭包会消耗内存。(closure)是一个函数以及其捆绑的周边环境状态(
2023-03-25 22:31:34
56
原创 createWebHistory和createWebHashHistory的区别
history每次刷新会向后端发起请求,需要和后端配合,如果对于项目没有硬性标准要求,我们可以直接使用hash模式开发。history刷新会出现404需要配nginx的url重定向。createWebHashHistory路由带#createWebHistory路由不带#
2023-03-24 10:46:40
561
原创 EventBus,$emit,$on
EventBusEventBus 又称为事件总线。如果组件之间没有引入关系,也不需要用vuex库来处理通信,则可以用EventBusmain.jsVue.prototype.$EventBus = new Vue()如果有两个组件A,B需要进行通信,点击A页面按钮则传递数据给BA.vue<button @click="sendMsg"></button> methods: { sendMsg() { EventBus.$emit("change",
2021-06-11 23:52:05
2125
1
原创 关于 vue.use(plugin, arguments)
Vue.use( plugin )先举个栗子,常见的用法import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex)安装 Vue.js 插件。如果插件是一个对象,必须提供 install 方法。如果插件是一个函数,它会被作为 install 方法。install 方法调用时,会将 Vue 作为参数传入。该方法需要在调用 new Vue() 之前被调用。当 install 方法被同一个插件多次调用,插件将只会被安装一次。plugins.j
2021-06-11 00:26:29
329
3
原创 两个数组重复id过滤
const arr = this.allChannels.filter(channel => { const idx = this.channels.findIndex(item => item.id === channel.id) if (idx === -1) { return true } }) return arr
2021-06-10 22:54:25
334
原创 构造函数和原型
构造函数:是一种特殊的方法,主要用来创建对象时初始化对象,及对象成员变量赋初始值,和普通的函数没有什么区别,只是习惯函数名首字母大写,调用时class Person
2021-06-07 22:51:43
78
原创 promise和async
由于javascript是单线程的,只能在JS引擎的主线程上运行的,所以js代码只能一行一行的执行,不能在同一时间执行多个js代码任务,这就导致如果有一段耗时较长的计算,或者是一个ajax请求等IO操作,如果没有异步的存在,就会出现用户长时间等待,并且由于当前任务还未完成,所以这时候所有的其他操作都会无响应。那么常见的异步模式有哪些呢?回调函数事件监听发布/订阅模式(又称观察者模式)promise具体JS是如何实现异步操作的呢?当JS解析执行时,会被引擎分为两类任务,同步任务(synchron
2021-06-07 13:37:12
309
原创 (git-报错)LF will be replaced by CRLF in README.md.
修改代码提交本地git add . 时报错LF will be replaced by CRLF in README.md. The file will have its original line endings in your working directory翻译:LF将被README.md中的CRLF所取代。该文件在您的工作目录中有其原始的行结尾git config --global core.autocrlf falsegit config --list...
2021-06-04 09:38:26
457
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人