- 博客(17)
- 收藏
- 关注
原创 淘宝式滑动隐藏搜索栏实现
要实现类似手机淘宝的下滑商品-顶部搜索框消失,上滑后-顶部搜索框出现的效果。核心方法,记录上一次滚动结束的位置,和此次滚动的距离方向进行判断。加载和销毁页面是监听或销毁事件。css部分,动画过渡效果。
2025-09-29 09:48:06
173
原创 canvas背景添加毛玻璃效果
如果通过css的方式给canvas设置backgroundImage和backdrop-filter,那么画布上的内容也会模糊。可以换个思路,把canvas的背景设置为透明,覆盖着经过毛玻璃化的图片。想要给canvas的背景图添加毛玻璃效果,现有api好像无法实现。背景图要被canvas覆盖。
2025-08-13 14:43:05
343
原创 vue爷孙组件传值问题
当遇到多个组件层层嵌套时,想要从祖先组件传值到孙组件就会使用provide和inject发送和接收传值,但是这个传值和props不同,不是响应式的,祖先组件修改了值孙组件不会同时修改。需要写成函数形式就可以解决。
2024-10-12 15:13:40
380
原创 vue动态引用script脚本标签
项目中有个功能是复制链接后,新开一个浏览器标签页打开分享页,但是这个分享页不需要之前引入的script标签,引入就会导致页面加载过慢。先把上面引入的script标签删除,获取当前的url,如果当前url不包含分享页的路由就动态添加script脚本。之前是直接在head中引入。
2024-08-16 14:36:05
1336
原创 谷歌浏览器控制台console.log打印的所属文件名不对
右侧的文件名应该是index.vue,但是现在显示的并不是。解决方法:点击右侧文件名接入源代码,有个警告确认一下就好了。还不行的话可以把设置里面的这两个选项关闭。
2023-12-15 09:44:47
1053
3
原创 js实现复制文本操作
let inputDom = document.createElement('textarea') // js创建一个文本框。document.body.appendChild(inputDom) //将文本框暂时创建到实例里面。inputDom.value = this.code //将需要复制的内容赋值到创建的文本框中。document.body.removeChild(inputDom) //最后移出。document.execCommand('copy') //执行复制操作。
2023-09-19 09:35:24
135
原创 Vue3学习笔记3 其他API
isProxy:检查一个值是否是reactive或readonly创建的。isReactive:检查一个值是否为reactive响应式对象。多层结构嵌套时,使用Teleport,to传送到任意的DOM节点。创建一个自定义的ref,对它的get和set方法进行控制。等待异步组件时渲染额外的内容提示。isReadonly:检查一个值是否为只读。isRef:检查一个值是否为ref对象。
2023-05-26 13:41:07
188
1
原创 Vue3学习笔记2 组合式API
本质是一个函数,对setup进行封装。类似vue2中的mixin。优势:复用代码,让setup中的逻辑更加清晰。
2023-05-25 19:44:11
169
1
原创 Vue3学习笔记
优势:无需打包,快速冷启动;谷歌商店搜索vue,下载带beta下标的开发者工具。一、创建vue3工程。下载vue3调试工具。
2023-05-23 11:10:11
104
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅