模拟器的小眼睛旁边的有个骨架屏功能,如下图:
这个一点进去,挖,不得了啊,马上生成了当前页面的骨架屏幕代码XXX.skeleton.wxml和XXX.skeleton.wxss在同级目录下
(上图为开发者工具生成的骨架屏代码,里面的参考文档链接目前是404状态)
然后在你的主wxml里引用后写相关代码就可以啦:
1、import上一步生成的wxml。(wxss里也导入对应的wxss)
2、插入template,这个template的展示逻辑由wx:if的isLoading控制,原来的正常显示代码用wx:else显示。isLoading初始化为true,表示先显示骨架屏,等你数据请求处理完后setData isLoading为false渲染你原来的正常页面。
你就能看到没加载完成数据前的骨架屏效果啦啦啦~~
我怎么找不到···
确认了一件事,是21号版本出的功能,哈哈
折腾了半天也没搞出来。放弃了
官方文档https://developers.weixin.qq.com/miniprogram/dev/devtools/skeleton.html
使用uniapp开发的小程序可以使用骨架屏吗?
可能需要手动复制生成的wxss样式复制到vue里面。
我没有具体实施过。原理是一样
这里每次都要手动添加<template name="">...</template>,重新生成后需要再次添加,有没有简单办法
我刚研究,还不会使用,感谢分享
我怎么看不到了
文档打不开,是不是被弃用了