- 博客(14)
- 收藏
- 关注
RSS订阅原创 圆形凸起的自定义 TabBar 实现
title: '首页',},title: '电影票',},title: '中央',},title: '订单',},title: '我的',</script>.tab-bar {*/*/bottom: 0;left: 0;right: 0;flex: 1;
2025-07-11 09:00:00
508
原创 Vue3 H5、原生微信小程序与 UniApp 自定义 TabBar 实现详解
确保你已经创建了一个 Vue3 项目（使用 Vite 或 Vue CLI），无需额外安装依赖。微信小程序默认提供了tabBar配置，但不支持动态修改或完全自定义样式。因此我们通常采用自定义 TabBar 方式。data: {tabs: [label: '首页',},label: '日志',},methods: {});});left: 0;right: 0;
2025-07-10 11:29:27
1222
原创 一个可拖拽可缩放的组件vue-drag-zoom-container
最近写一个缩放拖拽区域的h5的时候发现没什么好的拖拽缩放组件，用过vue-drag-resize，感觉不是很好用，所以我就写了一个vue-drag-zoom-container，虽然比较粗糙，但我要的功能基本都有，后面也会持续优化。
2025-07-09 09:00:00
425
原创 Vue3 组件通信详解：父子传值、兄弟通信与跨层级共享数据
方式适用场景是否推荐props/emit父子通信✅ 强烈推荐v-model双向绑定父子 props✅ 推荐多层嵌套或兄弟通信⚠️ 谨慎使用Pinia全局状态共享✅ 推荐mitt非父子组件通信✅ 推荐用于轻量级通信Vue3 提供了多种组件通信方式，每种都有其适用的场景和优势。理解它们的区别和使用时机，可以帮助你写出更清晰、可维护性更强的应用。希望这篇文章能帮助你更好地掌握 Vue3 的组件通信机制！
2025-07-08 09:00:00
422
原创 getSystemInfo和getWindowInfo区别
对比项是否同步✅ 是✅ 是是否包含❌ 否✅ 是是否包含✅ 是✅ 是是否包含❌ 否✅ 是（部分平台）是否受页面配置影响❌ 否✅ 是（如 navigationStyle）适用场景全局设备适配、系统判断页面级布局、安全区域适配多平台兼容性✅ 高⚠️ 某些平台（如 H5）可能返回不完整数据js深色版本用于获取设备基本信息，用于获取页面窗口布局细节（特别是安全区域）。两者互补，推荐一起使用。
2025-07-06 09:00:00
474
原创 h5电影选座区域缩放问题
这一块是居中的方法，我设置缩放区域初始化的时候为0.8倍大小，但是设置之后，这个区域就会往右偏下的位移，导致整个区域不是居中状态，所以我给他一个初始位移值让他居中显示。这一块是居中的方法，我设置缩放区域初始化的时候为0.8倍大小，但是设置之后，这个区域就会往右偏下的位移，导致整个区域不是居中状态，所以我给他一个初始位移值让他居中显示。这个是双击缩放区域，恢复原来大小比例的方法，但是这个跟缩放操作有冲突，当你两个手指按上缩放区域的时候就会恢复原状，暂时没有想到好的办法处理所以就先注释了。
2025-07-04 09:00:00
631
原创 js中，find，filter，map，some，every，reduce等等的使用和使用场景
方法返回值类型是否改变原数组特点find()单个元素 orundefined❌只返回第一个匹配项filter()数组❌返回所有匹配项map()数组❌返回新数组，长度不变some()布尔值❌至少一个满足就返回trueevery()布尔值❌所有都满足才返回truereduce()累计值❌功能强大，适合复杂逻辑键名数组❌操作对象时非常有用值数组❌配合 filter/map 使用键值对数组❌可遍历对象。
2025-07-03 09:00:00
986
原创 解决uni.getWindowInfo()获取safeAreaInsets里面的top经常为0
在开发跨平台移动应用时，处理设备的安全区域（如刘海屏、底部 Home Indicator 等）是一个常见的需求。在我们的项目中，我们定义了一个 Pinia Store 来存储安全区域的相关信息，包括状态栏高度、左右边距等。例如，在 H5 平台上，可以使用 CSS 的。为了应对可能存在的异步加载问题，我们可以实现一个简单的重试机制，持续检查。可能会返回不完整的数据，尤其是在页面尚未完全加载之前。的值为 0，这意味着我们未能正确地获取到设备的实际安全区域。的值为 0，影响后续的布局和样式调整。
2025-07-03 08:34:01
474
原创 微信小程序电影选座区域缩放问题。
最近我们项目组在对接电影，使用第三方接口，让用户到我们平台买票有优惠。里面涉及到选座问题以及选座区域的缩放。这篇文章主要讨论选座区域缩放问题。ui呢大概就是这个样子的要怎么做呢，我其实第一个想到的是scroll-view，但是后面一试发现不好做，scroll-view主要支持水平/垂直滚动，后面查资料看到了movable-area和movable-view，就用这个了。
2025-07-02 11:49:32
967
原创 el-select、el-option容易没注意到的小问题
最近一直在写后台，用的都是elementplus，使用选择框组件el-select 的时候，发现表单回显的时候，选择框一直展示value，而不是展示label。后面检查了好久才发现类型不一样，form.activityCategorize是Number,cateList里面的数据本来是Number，后面在我转换的过程中变成了string，所以造成了这种情况。碰到选择框一直展示value，而不是展示label，这种情况先检查数据是否匹配，数据类型是否匹配，再检查数据渲染的问题。
2025-07-02 11:01:05
210
原创 解决vue项目里面，img标签加载不出网络图片
Referer是http请求header的一部分，当浏览器向Web服务器发送请求的时候，请求头信息一般包含referer。该属性的作用就是告诉服务器这个链接是从哪个页面链接过来的，服务器就可以基于此信息进行处理。
2025-06-26 10:18:47
469
原创 微信小程序webview H5应用获取经纬度（高德JSAPI）
之前写过一个微信小程序里面嵌入的h5，需要获取当前经纬度，当时想的是使用微信的jssdk的wx.getLocation获取经纬度，但是这个需要使用wx.config，需要后端的签名和参数，小程序这边我动不了，所以就只能使用第三方的JSAPI，我这边用的是高德的。key: '2bec19f282f024605d68*************', // 替换为你的高德地图 API Key。获取位置的弹窗是这样的，手机必须打开了位置信息，不然会一直走。再在main.ts里面。
2025-06-25 17:15:00
725
原创 json数据组件vue3-json-viewer的引入以及简单使用
本人最近在写一个后台管理系统的时候需要记录调用第三方接口的情况，其中有请求参数和响应参数，响应参数有的数据结构比较复杂且比较大，不方便展示观看，所以用到了json展示组件vue3-json-viewer。这个组件的几个props我觉得要注意一下，好多文章都没写清楚，这是源码里面写的。然后在页面文件index.vue中导入使用。引入很简单不管是npm还是pnpm，先。然后在main.ts里面引入。修改这个组件展示的样式。我这边用到的就这几个。
2025-06-25 16:21:18
1019
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人