介绍 最近在做微信小程序时，顶部标题栏总是与胶囊对不齐。往往是在这款手机上对齐了，在另外一款手机差很多。我在查阅资料后，提出了一种方法解决这个问题，即：在页面onLoad或组件created时，利用微信小程序提供的API，获取系统状态栏高度和胶囊信息，进而动态调整顶部标题栏样式。在苹果、小米、荣耀手机做验证，能做到精准对齐。理论 胶囊样式应该是垂直居中，有1px的border，border-radius为18px。 若要使顶部标题栏与胶囊对齐，则其高度必须是导航栏高度，标题栏内容也要垂直居中，顶部标题栏的外边距或内边距必须是状态栏高度。 如果顶部
一、简介之前在Vue项目中使用过element的上传组件，实现了点击上传+拖拽上传的两种上传功能。然后我就在想是否可以通过原生的html+js来实现文件的点击上传和拖拽上传，说干就干。首先是点击获取上传文件自然没的说，只需要借助input标签即可，但原生的点击上传按钮，实在是过于简陋，所以我的想法是通过一个div，模拟成上传按钮，然后监听其点击事件，通过input.click()去模拟点击真正的上传元素。然后是拖拽获取上传文件，这个稍有难度，我的想法是通过HTML5新增的drag拖放API+dataTransfer来实现文件的拖拽获取，但是由于是html5新增的，所以可能在某些低版本IE浏览器
项目背景和意义 目的：本课题主要目标是设计并能够实现一个基于微信校园跑腿小程序系统，前台用户使用小程序发布跑腿任何和接跑腿任务，后台管理使用基于PHP+MySql的B/S架构；通过后台管理跑腿的用户、查看跑腿信息和对应订单。意义：手机网络时代，大学生通过手机网购日常用品、外卖外卖、代取快递等已不再是稀奇的事情。此外，不少高校还流行着校园有偿工作，校园跑腿就成了大学生创业服务项目。 因为你在校园里，所以不会有进入的限制。并不是所有的外卖平台都可以随意进入校园，比如小黄和小蓝的双打外卖平台。许多大学禁止送餐进入学校，更不用说送餐进入宿舍了。这一措施使得校园服务市场的竞争相对不
一、介绍一下vercelvercel是一个站点托管平台，提供CDN加速，同类的平台有Netlify和GithubPages，相比之下，vercel国内的访问速度更快，并且提供Production环境和development环境，对于项目开发非常的有用的，并且支持持续集成，一次push或者一次PR会自动化构建发布，发布在development环境，都会生成不一样的链接可供预览。但是vercel只是针对个人用户免费，teams是收费的首先vercel零配置部署，第二访问速度比github-page好很多，并且构建很快，还是免费使用的，对于部署个人前端项目路、接口服务非常方便vercel类似于git
🐱个人主页：不叫猫先生🙋♂️作者简介：前端领域新星创作者、阿里云专家博主，专注于前端各领域技术，共同学习共同进步，一起加油呀！💫系列专栏：vue3从入门到精通、TypeScript从入门到实践📢资料领取：前端进阶资料以及文中源码可以找我免费领取🔥前端学习交流：博主建立了一个前端交流群，汇集了各路大神，一起交流学习，期待你的加入！(文末有我wx或者私信)目录前言一、vue自定义指令directive讲解二、基于DOM的实现方式1.思路整理2.新建index.vue3.新建`directives`文件4.在`directives`文件下创建`index.ts`文件5.在`main.ts`中全局引
一、乱花迷人眼我就是被迷的那双眼。有时候需求来了，用熟悉的套路进行开发，确实很节省时间也能保证功能的稳定，但是这些开发的惯性无形中阻碍了我对技术的探索。我一直想改造详情页，解放重复功能开发的劳动力，但是详情页一眼望都是内容平铺，好像并没有什么可做的代码设计。后来我拨开繁花，发现详情页的组件化不必想的过于复杂，后台系统风格统一即可。因为大部分的详情页面是内容的展示，偶尔会出现少量的操作功能。将风格统一的部分进行组件化处理，操作功能使用回调函数放回当前页面，避免组件里做过多的业务逻辑。看，这不就成了。项目基于React框架开发的，所以代码写法是JSX语法，组件开发使用的hooks函数式组件，UI框
微信小程序webview中使用cover-view展示分享弹窗公司业务需要在webview中添加分享弹窗，可以发送给朋友及生成海报分享，因为好几个详情都需要这个功能，因此抽离了share-sheet的组件，ui效果如下图：点击分享，显示以下弹窗share-sheet.wxml如下：{!show}}"catchtouchmove="poptouchmove">发送给朋友生成海报取消share-sheet.js如下：Component({options:{addGlobalClass:true,},/***组件的属性列表*/properties:{//控制弹窗显示与否show:{type:Bool
微信小程序使用腾讯地图方法第一步：登录或者注册腾讯地图官方（地址：https://lbs.qq.com/）第二步：在创建sdk；创建方法：进入控制面板后显示创建sdk，点击之后输入名称和选择应用场景后点击设置选择web和小程序后输入APPID后点击确定就好。第二步：在微信小程序开发管理页面里面的域名管理里面输入合法域名：(https://apis.map.qq.com)就提交就可以。第三步：在腾讯地图官方网站上下载相关的sdk就可以。第四步：在下载的压缩文件夹里面找到（qqmap-wx-jssdk.js）文件引入到相关页面。引入方法：（index.js文件来描述）//引入进来腾讯地图的sdkv
目录一、小程序交互前端：1、先在登陆界面中编写代码2、在前端中编写js代码后端： 1、先导入依赖： 2、定义好配置文件 3、编写好实体类 4、将帮助类进行配置 5、编写mapper类 6、定义service层以及对应的实现接口层 7、最后定义controller层 8、进行测试一、小程序交互步骤：前端：1、先在登陆界面中编写代码login.wxml:{true}}"bind:input="changeValue"maxlength="16"data-label="password"/>登录2、在前端中编写js代码import{r
文章目录前言一、注册小程序二、项目创建三、运行项目四、其他配置最后前言此次项目开发使用uniapp和uview进行开发，需要用到的开发工具为HBuilderX和微信开发者工具，具体的安装方式见官网，小程序注册见微信公众平台。一、注册小程序注册在微信公众平台注册小程序，按照提示注册完后会发配一个appid和密钥，需要复制保存好。完善信息设置=>基本设置，填写小程序基本信息，包括名称、头像、介绍及服务范围等。第三方设置根据开发需求添加插件授权。成员管理管理=>成员管理，点击编辑或下拉选择添加成员，输入微信号添加新的项目成员，只有成员可以进行真机测试。体验成员可以使用发布的体验版。开发设置开发=>开
