- 博客(10)
- 问答 (2)
- 收藏
- 关注
RSS订阅原创 监听移动端物理返回键
在移动端的h5交付评审的时候，被提了个交互体验层的问题：为什么点击右上角的叉号是关掉视频回到视频列表页，但是通过左滑或者浏览器底部的返回键就会回到视频列表页的上一个页面？其实简单来讲，就是监听移动端包括浏览器的物理返回键的问题，那么需求就是监听复写这个物理返回键触发的事件；但是需要注意的是，不能改写整个页面的所有返回事件，这样会干扰用户的正常使用习惯。
2025-01-03 16:10:10
782
原创 实现一个平滑的可拖拽的弹窗（仿小米闹钟底部弹窗逻辑）
我们开发前端，尤其是移动端的页面时，经常会遇到需要弹窗展示的内容。实现一个弹窗十分简单，但无论是出于整体UI样式的规范，还是出于优化用户的体验，一个足够丝滑的弹窗总是我们更期望的。1、弹窗弹出和收起动画平滑，非突兀的出现或消失。2、顶部（其他部位也可以）有一个可供用户拖拽收起弹窗的拖拽条。3、用户向下拖动时，若是单纯的向下拖动，则不论滑动距离，直接收起弹窗；若向下拖动之外中途还有过往上拉的动作，则滑动距离大于100px（可自定义）时，弹窗才会收起，反之则回弹。
2025-01-03 16:09:13
1035
原创 接手Vue项目后的一些学习
如果是vue3的项目，想必是离不开这两个新的响应式数据绑定方式的。区别于原先的data，ref和reactive定义和修改起来十分的方便。可以看到，ref可以绑定基础类型的数据，比如字符串、数字等，但是reactive只能绑定对象，不过也可以通过ref({count: 1})的形式初始化count的值。在取值时，ref是需要通过.value的形式，获取到绑定下的内容的，而reactive则可以直接获取值；但是在差值{{videoLoading}}下，会自动展开获取videoLoading.value。
2024-11-27 15:10:11
463
原创 JavaScript权威指南（第七版） 第17章 读书笔记
尤其是在排查细微问题时，正确的缩进、===代替==、let代替老旧的var、或是删除定义了但是未使用的变量，这些都能很好的起到帮助的作用。在方法中使用了网络请求的时候，可以通过jest.mock模拟请求时依赖的模块或是方法，通过mockResolvedValue模拟请求的返回值，通过expect(function).toBe来验证方法的输出是否符合预期。JavaScript动态语言的特性，导致编写时可以比较随意的使用或者修改变量，但是在规范性或是代码强壮程度上，变得更多是靠个人的代码习惯。
2024-07-02 16:00:05
778
1
原创 npm包需要的依赖
在 Webpack 这样的前端构建工具中，loader是一个用于处理模块的转换器。当 Webpack 遇到一个模块时，它会查找与该模块相关的 loader，并使用该 loader来处理该模块。处理后的结果（通常是转换后的代码或资源）将被 Webpack 进一步处理。loader会将webpack不认识的css文件、较新的es语法等通过配置的规则，处理为webpack认识的模样，以供最后的打包处理。所以针对当前的需求，我们需要在webpack.config.js中，增加对不同文件的处理规则。
2024-07-02 14:35:14
705
原创 npm的初始化使用，以及带着jsx的npm内容的引用
这里需要注意的是，npm的包每次发布到镜像站可下载使用有5-10分钟的延迟，这对开发人员很不友好，所以在更改包内代码的时候，更加建议联调本地的npm包，方法也十分简单，在当前代码中npm link生成本地包地址，然后在引用包的地方npm link 地址 就可以测试本地的npm包了。但是，如果想要实现像是组件库一样的UI部分，而且不想傻傻的用dom元素一个个创建的话，那就需要引入babel去处理代码中的jsx文件，不然的话jsx语法的内容是没有办法在包之间被解析的。应该还有要补充的，等项目完成之后续上。
2024-07-02 11:41:39
506
原创 12月工作踩坑经验总结
父子元素同时设置了margin-right之后，子元素的margin-right不生效，没有撑大父元素的盒子。很多时候因为UI原因，padding并不能完全替代margin的作用，这个情况可以考虑给父元素设置一个对应的border-right，这样子元素的margin-right就不会溢出父元素。这样的层级也更加清晰，father-element就像是一个抽屉柜，加上的这层div是抽屉，最里面的child-element是抽屉里放的物品。如此也能更好算出哪个选择器的样式是最后生效的。
2024-01-30 14:56:44
546
1
原创 iOS上小程序开发踩的一些坑
由网上大家踩的坑总结，当盒子高度为奇数时，更容易出现上下边框的缺失，当宽度为奇数的时候，更容易出现左右边框的缺失。另外，在使用position：fixed固定底部按钮位置的时候，需要注意的是父元素的overflow是否一致，因为fixed本质上是相对最近的带滚动条的父元素的位置进行定位。onclick在执行顺序上是晚于ontouchend的，也就是说，如果叠加着的元素分别设置了onclick和ontouchend，会使ontouchend的元素消失后，再触发下面的onclick，非常影响滑动的设置。
2023-12-26 16:09:23
1497
1
原创 学习笔记：由import延伸到export
export的好处是，在保证文件其余内容不可见时，将内容按需的抛给外部，类似于Java中的private或者protected。在import时，也可以更精确地获取到所需的部分，大大增加了代码的可复用性，避免了代码的冗杂。可以说，import和export是代码模块化的基础。
2023-11-13 11:02:43
161
空空如也
进了实业企业该如何提升自己
2022-08-03
Java笔试题，希望给个思路
2022-03-29
TA创建的收藏夹 TA关注的收藏夹
TA关注的人