微信小程序开发工具,现在支持一键生成骨架屏功能。
骨架屏是页面的一个空白版本,通常会在页面完全渲染之前,通过一些灰色的区块大致勾勒出轮廓,待数据加载完成后,再替换成真实的内容。通常在小程序中,我们需要手工维护骨架屏的代码,当业务变更时,同样需要对骨架屏代码进行调整。为了开发的便利,开发者工具提供了自动生成骨架屏代码的能力。
使用方法
工具可以为当前正在预览的页面生成骨架屏代码。工具入口位于模拟器面板右下角三点处。
点击生成骨架屏,将有弹窗提示是否允许插入骨架屏代码。确定后将在当前页面同级目录下生成 page.skeleton.wxml 和 page.skeleton.wxss 两个文件,分别为骨架屏代码的模板和样式。
骨架屏代码通过小程序模板(template)的方式引入 以 pages/index/index 页面为例,引入方式如下。
<!-- pages/index/index.wxml 引入模板 -->
<import src="index.skeleton.wxml"/>
<template is="skeleton" wx:if="{{loading}}" data="{{}}"/>
/* pages/index/index.wxss 中引入样式 */
@import "index.skeleton.wxss";
可参考学习官方提供的示例代码:https://developers.weixin.qq.com/s/3AQoEBmh7XhF
-
如何修改微信小程序原生组件外观样式如何修改微信小程序原生组件外观样式
-
微信小程序「评价组件」评分后无法再次打开入口微信小程序像个桥梁,连接了用户和开发者。它提供了很多方便的功能组件,其中有个叫做「评价发布组件」的特别实用。这个组件让开发者能轻松地在小程序里加入评价功能,邀请用户打分和反馈。
-
监听菜单按钮(右上角胶囊按钮)的布局位置信息变化事件wx.onMenuButtonBoundingClientRectWeightChange 为微信小程序监听菜单按钮(右上角胶囊按钮)的布局位置信息变化事件API。
-
wx.getDeviceBenchmarkInfo 获取设备性能得分和机型档位数据APIwx.getDeviceBenchmarkInfo是微信小程序获取设备性能得分和机型档位数据API。
-
wx.openHKOfflinePayView 拉起WeChat Pay HK付款码APIwx.openHKOfflinePayView是微信小程序拉起WeChat Pay HK付款码API。
-
微信小程序打开任意公众号文章 wx.openOfficialAccountArticlewx.openOfficialAccountArticle是微信小程序通过小程序打开任意公众号文章api,不包括临时链接等异常状态下的公众号文章,必须有点击行为才能调用成功。
暂无评论,抢个沙发...