- 综合排序
- 最热优先
- 最新优先
- 来自专栏grain先森
前端-微信小程序开发(5)：日历组件的实现
作者：叶小钗 http://www.cnblogs.com/yexiaochai/p/9412951.html 接上文： 微信小程序开发(4)：打造自己的UI库 github地址：https: 这个日历组件应该是在小程序中写的最复杂的组件了，尤其是很多逻辑判断的代码都放在了WXML里面，根据之前的了解，小程序渲染在一个webview中，js逻辑在一个webview中，他这样做的目的可能是想让性能更好 Component提供的是一个标签，而且涉及的文件很多，加上继承关系很不好管理 ② 因为日历组件事实上是一个标签，所以我们会有一个引入的基础WXML，一个使用的js，完全独立一个文件更加复杂 ③ 本来小程序或者复杂的页面都应该组件化开发 ，所以我们简历一个页面级别的组件，分散到对应的页面中 小程序像是给灵活的HTML&JS戴上了枷锁，只允许在其允许的范围灵活，我们这里尝试对页面进行再拆分： ?
2.5K20发布于 2019-03-29 鸿蒙5开发宝藏案例分享---PC开发案例解析
鸿蒙PC/2in1开发宝藏指南：官方案例实战解析 **大家好呀！** 最近在折腾鸿蒙的PC/2in1应用开发，才发现官方文档里藏了一堆超实用的案例！ 关键代码全在`module.json5`里加`deviceTypes: ["2in1"]`，否则PC特性不生效！ 1. **重复布局：列表/瀑布流/网格** **痛点**：小屏单列 → 大屏多列，提升信息密度 **关键属性**： - **列表**：`List().lanes(3)`（ 大屏3列，小屏默认1列） - **瀑布流**：`WaterFlow().columnsTemplate('1fr 1fr 2fr')`（第三列占双倍宽度） - **网格**：`Grid 本文案例均来自官方[《一多开发实践》](https://developer.harmonyos.com/cn/docs/documentation/doc-guides/responsive-layout
42610编辑于 2025-06-17鸿蒙5开发宝藏案例分享---Web开发优化案例分享
**开头打个招呼：**嘿，各位鸿蒙开发者们，大家好啊！是不是经常被Web页面加载慢、卡顿搞得头大？尤其是在咱们的HarmonyOS应用里嵌入个H5页面，用户等得花儿都谢了还没出来，体验分分钟掉光？ 官方其实提供了超多实用案例和指导，但可能藏得有点深，今天我带大家捋一捋，重点讲讲那些能立竿见影的优化手段，配上代码讲解，包你学完就能用！ - **适用场景：** App里高频使用的Web页面（比如首页某个重要入口、用户中心的某个H5模块）。 显示 fallbackWebView }}// 重要：谨慎使用，及时销毁未使用的预渲染实例释放资源```5. 也欢迎大家分享自己挖到的鸿蒙开发宝藏知识！一起学习，共同进步！ #HarmonyOS #ArkWeb #性能优化 #Web加载 #开发者宝藏
55410编辑于 2025-06-17- 来自专栏学习猿地
Web前端学习 第10章 小程序开发5 常用接口介绍
长度为32个字符以下 包 串 是 统一下单接口返回的prepay_id参数值，提交格式如：prepay_id = *** signType 串 是 签名算法 paySign 串 是 签名，具体签名方案参见小程序支付接口文档 成功 功能 否 连接调用成功的某些函数 失败 功能 否 连接调用失败的某些函数 完成 功能 否 连接初始化结束的某些函数（成功，失败都会执行） 三，小程序重启 wx.navigateToMiniProgram （对象对象） ：另一个小程序可以通过另一个小程序的appid来替换到另一个小程序 参数： 属性 类型 必填 说明 appid 串 是 要打开的小程序id extraData 目的 否 需要传递给目标小程序的数据 ，目标小程序可在App.onLaunch，App.onShow中获取到这份数据。 后面的部分会成为查询，在小程序的App.onLaunch，App.onShow和Page.onLoad的相应函数或小游戏的wx.onShow的函数，wx.getLaunchOptionsSync中可以获取到查询数据
1.4K10发布于 2020-07-08 - 来自专栏grain先森
前端-小程序开发实践总结
我司也不例外，我们整个前端团队这半年来基本上都是在开发小程序。前前后后也开发了四五个小程序了。总觉得要留下点什么，既是记录那些年我们踩过的坑，也是希望大家别再掉坑。 小程序布局采用rpx单位，UI稿按照750的宽度出图。可直接使用UI稿的尺寸。但是在某些机型上1rpx会无法显示。可以用H5的方式实现1px效果。 复杂组件的开发，省市区三级联动选择器的开发，获取微信地址库的地址的编码和业务采用的省市区编码对不上。 页面路径的层级，最大不能超过10层。 小程序小程序分包加载，微信对小程序包的大小有如下限制。 离线包加载 离线包加载，常见的Hybrid App通过webview加载H5页面，前端页面都是放在服务器端。虽说保证了灵活性。但是加载性能收网速影响大。页面切换白屏时间长。小程序离线包的加载方式。 一次性加载所有的前端资源到本地再解压。大大提升了用户体验。不过微信官方为了防止下载离线包的时间过程，也严格限制了小程序包的体积。
1.9K20发布于 2019-03-29 鸿蒙5开发宝藏案例分享---Pura X开发案例分享
鸿蒙宝藏案例分享：Pura X 外屏开发实战解析 大家好！我是你们的鸿蒙开发小伙伴。今天在翻阅官方文档时，意外发现了华为藏着的"宝藏级"案例——Pura X 折叠屏外屏开发实践！ 24vp vs 48vp） - 操作方式需**单手友好**（查看通知/支付/导航等高频操作） - 需特殊处理**布局挤压**/**内容截断**问题 官方通过 **5 .layoutWeight(3) // 上方弹性占位 Button("点赞") Blank().layoutWeight(1) // 下方弹性占位 } } } 5️⃣ 特别是**滑动隐藏控件**和**双断点响应式**的设计，能直接用到其他鸿蒙设备开发中。 （原创整理不易，如果觉得有用，点个赞让我知道吧~ 下期分享"鸿蒙分布式相机开发"实战！）
37010编辑于 2025-06-17- 来自专栏前端小歌谣
ES5计算器小案例
前言 我是歌谣 最好的种树是十年前 其次是现在 今天继续给大家带来的是ES5计算器小案例的深入讲解 环境配置 npm init -y yarn add vite -D 修改page.json charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>计算小案例 charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>计算小案例
37710编辑于 2023-11-11 鸿蒙5开发宝藏案例分享---性能优化案例解析
### 鸿蒙性能优化宝藏指南：实战工具与代码案例解析 大家好呀！今天在翻鸿蒙开发者文档时，意外挖到一个**性能优化宝藏库**——原来官方早就提供了超多实用工具和案例，但很多小伙伴可能没发现！ **开发阶段：静态代码扫描 (Code Linter)** **作用**：在编码时实时检测性能隐患，比如冗余布局、过度渲染等。 **优化方案**：用`List`替代`ForEach+Row`，复用组件： ``` List({ space: 5 }) { ForEach(this.dataList, (item) => **实战案例**：页面打开时延高 - **操作流程**： 1. 1. 体检工具导出`perfdata`文件 → 1. 用Profiler导入 → 1. ** * * * **PS**：更多案例可去官网搜“性能最佳实践”关键词，官方Demo仓库里还有惊喜哦！
37010编辑于 2025-06-17- 来自专栏夏天的前端笔记
每天10个前端小知识 【Day 5】
前端面试基础知识题 1. typeof 与 instanceof 有什么区别 typeof与instanceof都是判断数据类型的方法，区别如下： typeof会返回一个变量的基本类型，instanceof splice() slice() 改 - 即修改原来数组的内容，常用splice splice() 查 - 即查找元素，返回元素坐标或者元素值 indexOf() includes() find() 5. 前端实现动画有哪些方式？ 前端常用的动画实现方式有以下种： css3的transition 属性 css3的animation 属性 原生JS动画 使用canvas绘制动画 SVG动画 Jquery的animate函数 使用gif
48810编辑于 2024-01-18 鸿蒙5开发宝藏案例分享---Grid性能优化案例
最近在鸿蒙开发者社区挖到一个超实用的性能优化案例——**解决Grid组件加载慢、滚动卡顿的问题**。官方其实藏了不少宝藏案例，但很多人可能没注意到。 今天我就带大家拆解这个案例，加上详细讲解和代码分析，帮你轻松提升应用流畅度！* * *### **问题场景：为什么Grid会卡？ * * *### **个人心得**鸿蒙的文档里其实埋了不少“性能宝藏”，这个案例就是典型——**用计算代替遍历**的思路，在拖拽列表、瀑布流等场景都能复用。 开发时多留意社区案例，能少踩很多坑！如果你有其他Grid的优化技巧，欢迎在评论区交流呀~ 也欢迎提问，一起探讨鸿蒙开发中的那些事儿！
40610编辑于 2025-06-18鸿蒙5开发宝藏案例分享---平板开发实践
以下是根据官方文档整理的鸿蒙平板开发实战指南，结合代码解析和避坑要点，帮你高效实现“一次开发，多端部署”### 一、开篇：为什么平板开发不同？平板三大特性决定开发策略：1. **交互扩展**：支持键鼠 → 需增加悬浮/焦点/快捷键逻辑 **工程配置第一步** 在`module.json5`中声明支持设备类型：```"deviceTypes": ["tablet"] // ```* * *### 二、核心场景开发详解（附代码）#### 1. || ----- | ------- | ----------------------- || 长列表滚动 | 启用组件复用 | `.cachedCount(5) 吃透本文5大布局方案，效率提升50%！” —— 来自踩坑3周的老司机
42810编辑于 2025-06-17- 来自专栏贾志刚-OpenCV学堂
PyQT5案例开发
应用开发层面，需要三个主要的交互与显示界面，一个是针对YOLOv8检测与跟踪模型的模型参数设置；第二个是针对YOLOv8检测与跟踪结果的显示过滤与输出过滤的后处理；第三个是针对后处理数据的显示包括流量出入 整个程序开发实现了跟踪线程与界面线程分别独立工作，支持数据交互，实时显示运行结果与流量统计信息展示。 1280, 720), QtCore.Qt.KeepAspectRatio) self.label.setPixmap(pix) self.show_text("OpenCV开发者联盟
55830编辑于 2023-08-23 - 来自专栏应用案例
实用的前端开发小技巧汇集
前端开发或许我们总是会粗心大意，整理给伙伴们准备了一些比较实用的技巧。 首次给变量赋值是切记使用var关键字(闲谈：清楚的记得有次去面试前端，一个项目经理同时面我和另外一个人，面试官开始就是要我们俩手写一个数组去重函数，哗哗的一下写完交了，面试官看来下之后直接给了一旁的竞争对手 多年行业分享前端技术勤213126486，多探讨技术提升技能，编号糯米才会同意哦 行尾使用分号。 实践中最好还是使用分号，忘记写也没事，大部分情况下JavaScript解释器都会自动添加。 = 5) doSomething(); 逻辑或还可用来设置默认值，比如函数参数的默认值。 希望你在开发中科院少走一点弯路
1.3K100发布于 2018-01-23 - 来自专栏云开发小程序1
二挡起步——pythonweb开发Django框架，前端原生+Django后端框架002（附带小案例）
它最初是被开发来用于管理劳伦斯出版集团旗下的一些以新闻内容为主的网站的，即是CMS（内容管理系统）软件。并于2005年7月在BSD许可证下发布。 spm=1000.2115.3001.5343") 效果：当我们在浏览器输入我们写的路由，Django会利用该重定向给我们跳转到上当的地址（这里的地址是我的CSDN主页地址） 文末小案例（用户登录简单案例 return render(request, "login.html",{"tishi_1":tishi}) 上面代码： 1.使用request.method返回用户访问时的请求方式,判断并进入相应前端路由 2.如果判断对，进入login.html页面 3.否则，获取用户post的数据（表单中提交的数据） 4.判断用户输入的账号和密码是否与设置的一致 5.一致，则重定向页面为： https://blog.csdn.net # return HttpResponse("返回内容") # 5.【响应】读取HTML的内容 + 渲染（替换） -> 字符串，返回给用户浏览器。
79820编辑于 2023-10-14 - 来自专栏喇叭的学堂
前端开发小技巧（持续收集中）
该文章主要收集前端开发小技巧，如果有疑惑问题或者错误，欢迎大家在评论区交流 1、让文字左右出现一条线 如下图，实际上就是通过左右伪类制作的，需要把主标签设置为flex盒子，然后给伪类加flex：1进行划分
33410编辑于 2024-03-11 - 来自专栏学习猿地
Web前端学习 第10章 小程序开发4 小程序开发
讯息} } 4 < / li > 5 < / ul > 6 var example1 = new Vue （{ 7 el：'＃example-1' ， 8 data：{ 9 项目：[ 10 { 消息：'Foo' } ， 11 { 消息：'Bar' } 12 ] 13 } 14 } ） 小程序 微信小程序循环 ：'Foo' } ， 5 { message：'Bar' } 6 ] 7 } 8 } ） 9 < 文字 wx：for = “ {{items}}” > { { item } 把需要传递的数据作为形参放置就可以了，例如： 1 // <button @ click =“ say（'明天不上班'）”> </ button> 2 3 新 Vue （{ 4 el：'#app' ， 5 // <view class ='tr'bindtap ='toApprove'data-id =“ {{item.id}}”> </ view> 2 页面（{ 3 数据：{ 4 原因：'' 5
1.8K40发布于 2020-07-08 - 来自专栏大数据钻研
HTML5游戏前端开发【秘籍】
QQ空间Android版4.2和4.5上线的玩吧游戏“空间疯狂套牛”是一款使用HTML5开发出的手机游戏，虽然还有很多不足，但其中使用的一些技术与技巧还是很有必要为大家分享出来，方便大家用秘籍打通各种关卡创造出更多更好的 HTML5游戏。 元素的容器宽高就是这个元素的大小 width: 97px; height: 73px; 为了适配Retina所以图片是按2x大小做的，然后又通过 background-size: auto 73px; 将图片缩小到1/2大小 所以移动位置也要缩放一半background-position: -388px 0 这里的难点在于图片的处理，以下是一些实例，供大家参考： 另外要注意绳子这里其实是有三个状态， 要分成三个CLASS来写，方便开发时切换不同的状态 这里还要说下设计这里还有一个可优化的空间，这就是扁平化，从技术角度来看扁平化有三大优点： 图片素材好制作 游戏打开速度快 运行速度快 前两点比较好理解，第三点的原因是因为图片比较小，所以占用的内存也小，
2.5K70发布于 2018-04-18 鸿蒙5开发宝藏案例分享---冷启动优化案例分享
这些官方宝藏案例让我效率翻倍 大家好呀！最近在优化鸿蒙应用时，我偶然发现了官方文档里隐藏的性能优化宝藏案例。这些实战经验让我的应用启动速度直接起飞！ while(count < 2000000) { count++ } }}```* * *### 二、冷启动全流程拆解官方将冷启动分为5个关键阶段：1. 秒执行}```✅ **效果**：UI Ability OnForeground阶段从4.1s → 0.2s#### 2️⃣ 启动图标分辨率优化**修改entry/src/main/module.json5* 数据到位才渲染 ComplexComponent() } else { LoadingIndicator() } }}```* * *### 六、总结通过官方这些实战案例 这些宝藏案例都在[官方性能优化文档](https://developer.harmonyos.com/)中，强烈建议大家仔细研究。
43210编辑于 2025-06-17鸿蒙5开发宝藏案例分享---穿戴开发宝藏指南
之前开发智能穿戴应用时感觉资源匮乏，没想到在“最佳实践”里藏着这么多**现成的、高质量的案例和代码**！ 今天必须跟大家好好分享一下这个“轻量级智能穿戴开发实践”宝典，看完绝对让你少走弯路，开发效率飙升！* * *# 鸿蒙穿戴开发宝藏指南：官方最佳实践案例深度解析大家好！ 最近在折腾HarmonyOS智能穿戴应用开发，本以为要苦苦摸索，结果偶然在鸿蒙官方文档的“最佳实践”->“设备场景”->“穿戴”路径下，发现了这份 [**轻量级智能穿戴开发实践**](https://developer.harmonyos.com 无论你是刚开始接触鸿蒙穿戴开发，还是在项目中遇到了特定难题，这份“轻量级智能穿戴开发实践”文档绝对值得你花时间仔细研读，并把它加入浏览器书签！ 大家开发中有什么有趣的发现或者踩过的坑，也欢迎在评论区交流讨论呀！
46510编辑于 2025-06-17鸿蒙5开发宝藏案例分享---折叠屏开发实践
最佳实践案例大揭秘！开发者的隐藏宝藏手册 **大家好呀！ ** 今天在翻鸿蒙文档时突然发现了一个惊天大宝藏——官方其实早就默默放出了**几十个超实用开发案例**，覆盖折叠屏适配、性能优化、UI框架、跨设备协同等核心场景！ **真实代码片段**：每个案例都附带**可直接复用的核心代码** - **避坑指南**：针对开发高频问题（如折痕避让、横竖屏断层）给出解决方案 - **设计+代码双料教程 **：连UX规范都帮你定好了 下面重点解析几个硬核案例 宝藏案例实战解析 案例1：折叠屏悬停态开发（视频播放场景） **痛点**：折叠屏悬停时操作区遮挡内容 **官方方案** 这些藏在文档里的案例，简直就是鸿蒙开发的 **「瑞士军刀」**。尤其折叠屏开发部分，从基础布局到悬停交互，官方连性能优化参数都给你调好了。
40110编辑于 2025-06-17
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号