评论

添加到我的小程序提示组件

用于提示用户首次进入小程序时,点击右上角菜单进行【添加到我的小程序】操作

Mini-add-tips

用于提示用户首次进入小程序时,点击右上角菜单进行【添加到我的小程序】操作

特性

与支付宝原收藏组件(添加到首页)保持样式一致,支持在自定义导航栏场景下保持一致效果。

预览

截图

样例

开发者工具预览

安装使用

1. 获取组件

下载release(稳定)

latest release

master(最新)

git clone https://github.com/MakerGYT/mini-add-tips.git

将项目中components/add-tips文件夹拷贝到组件路径下

2. 引入组件

在使用该组件的页面对应json文件中添加:

{
  "usingComponents": {
    "add-tips":"/components/add-tips/index" 
  }
}

3. 使用组件

<!-- index.wxml -->
<add-tips name="示例"/>

自定义导航栏请参考/pages/index

属性列表

属性 类型 默认值 必填 说明
name String 测试 小程序名称
logo String 小程序Logo
duration Number 10 持续显示时间(s)
delay Number 2 进入页面延迟时间(s)开始显示
custom Boolean false 当前页面是否{“navigationStyle”: “custom”}

开发说明

鉴于目前微信基础库的设计:

  1. 收藏操作与添加到我的小程序对于用户容易混淆,但效应一样,故没必要具体引导用户。目前只有监听用户点击右上角菜单“收藏”按钮的行为,但实际上兼听不到收藏行为,只能定义收藏内容
  2. 无法获知是否已经收藏、是否已经添加到我的小程序,故提示可能对用户造成干扰。
  3. 目前没有可以调起添加小程序的api、button,或许出于"降低干扰度"的考虑,但就迫使手动设置引导,又会造成如2中所述干扰。
  4. 即便已经设置{“navigationStyle”: “custom”},其导航栏相关的api依然调用是有效的,无论组件还是页面内均无法据此获知导航栏是否custom,只能由外部传入。

Todo

License

MIT © MakerGYT

最后一次编辑于  07-02  
点赞 0
收藏
评论

3 个评论

  • ericz9
    ericz9
    07-04
    这个好
    07-04
    赞同 1
    回复
  • 理想
    理想
    08-12

    github 密码忘记了,懒得找回,我码云微信登录,所以比较方便,我fork过来了

    https://gitee.com/zhaoquan/mini-add-tips,欢迎一起继续维护

    1.修复显示位置距离顶部太远,box样式新增margin-top: -135rpx;

    2.修复写缓存的hidden函数下不执行,另外setStoragesync不执行,改在shrink函数下,api改为setStorage

    3.新增:小程序官方也没有检测用户是否添加的API,新增写入缓存的是时间戳,然后7天内不再提醒

    08-12
    赞同
    回复 1
    • 一骑白马开吴疆®
      一骑白马开吴疆®
      08-18
      1. 请提供原始代码下显示实例图
      2. hidden函数与组件的点击绑定,点击即可消失,详见 index.wxml 第3行
      08-18
      回复
  • 理想
    理想
    08-12

    github 密码忘记了,懒得找回

    组件下的js,最下面的hidden函数我是整个删除,因为不会执行,我是把setStorage,移动到下一个函数里(shrink),并且改成异步写入缓存,这个缓存写成功,下次用户再其他小程序就不会提醒了,,我准备改造一下,值写成日期,然后几天后就会再次提醒
    


    wx.setStorage({
            key:STORAGE_KEY,
            data:true
          })
    
    


    另外一个问题,就是显示的位置不对,我是在 wxss,第一个.box尾巴加了margin-top: -135rpx;,然后大概显示正常了,不知道其他机型怎么样

    08-12
    赞同
    回复 1
    • 一骑白马开吴疆®
      一骑白马开吴疆®
      08-18
      1. 请提供原始代码下显示实例图
      2. hidden函数与组件的点击绑定,点击即可消失,详见 index.wxml 第3行
      08-18
      回复
登录 后发表内容