{"id":21301958,"url":"https://github.com/liudding/wx-pin-prompt","last_synced_at":"2025-08-23T03:03:12.588Z","repository":{"id":57400418,"uuid":"343109908","full_name":"liudding/wx-pin-prompt","owner":"liudding","description":"微信小程序，「添加到我的小程序」提示。 带有详细引导步骤。支持自定义导航栏。支持横竖屏。支持 npm 安装","archived":false,"fork":false,"pushed_at":"2024-11-28T16:30:52.000Z","size":1403,"stargazers_count":33,"open_issues_count":2,"forks_count":4,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-07-06T15:17:52.838Z","etag":null,"topics":["min-program","minapp","mini-program","miniprogram","wechat","wechat-app","weixin","weixin-app"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/liudding.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-02-28T13:17:28.000Z","updated_at":"2025-04-14T03:53:00.000Z","dependencies_parsed_at":"2024-11-28T17:35:03.956Z","dependency_job_id":null,"html_url":"https://github.com/liudding/wx-pin-prompt","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/liudding/wx-pin-prompt","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liudding%2Fwx-pin-prompt","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liudding%2Fwx-pin-prompt/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liudding%2Fwx-pin-prompt/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liudding%2Fwx-pin-prompt/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/liudding","download_url":"https://codeload.github.com/liudding/wx-pin-prompt/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/liudding%2Fwx-pin-prompt/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":264892259,"owners_count":23679261,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["min-program","minapp","mini-program","miniprogram","wechat","wechat-app","weixin","weixin-app"],"created_at":"2024-11-21T15:53:38.353Z","updated_at":"2025-07-11T20:31:28.994Z","avatar_url":"https://github.com/liudding.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# pin-prompt “添加到我的小程序”提示框\n\n微信小程序中，提示用户点击右上角按钮，**添加到我的小程序**。\n\n* 长条状无干扰方式展示\n\n* 卡片状带详细引导步骤展示\n\n* 支持自定义导航栏\n\n* 支持横竖屏\n\n* 支持自动提示\n\n  \n\n### 扫码体验\n![demo-1](./demos/demo.png)\n\n### 示例\n![screenshots](./demos/screenshots.jpg)\n\n### 安装\n\n#### 方式一：npm\n\n```\nnpm i --save wx-pin-prompt\n```\n\n然后，在微信开发者工具中执行 **「构建 npm 」**\n\n#### 方式二：直接下载源码\n\n直接下载源码，添加到你的项目中\n\n\n\n### 使用\n\n在页面 json 文件 `usingComponents` 中添加组件\n``` json\n\"pin-prompt\": \"/miniprogram_npm/wx-pin-prompt/pin-prompt\"\n```\n\n在 wxml 文件中\n\n```html\n\u003c!-- 自动在第一次进入时，展示添加提示框，之后不再显示 --\u003e\n\u003cpin-prompt auto delay=\"{{3}}\" name=\"我的小程序\" logo=\"../pathtoyourlogo.png\"\u003e\u003c/pin-prompt\u003e \n\n\u003c!-- 展示带有详细引导步骤的提示框 --\u003e\n\u003cpin-prompt show type=\"card\" name=\"我的小程序\" logo=\"../pathtoyourlogo.png\"\u003e\u003c/pin-prompt\u003e \n\n\u003c!-- 如果页面使用了自定义的导航栏 --\u003e\n\u003cpin-prompt show customNavbar name=\"我的小程序\" logo=\"../pathtoyourlogo.png\"\u003e\u003c/pin-prompt\u003e \n```\n\n\n\n\u003e ⚠️注意：通过 npm 安装，可能会遇到在开发者工具报错 “渲染层网络层错误” 。可忽略。在真机上可以正常运行。\n\n\n\n\n\n### 参数\n\n| 属性       | 默认值                           | 说明                                                      |\n| ---------- | -------------------------------- | --------------------------------------------------------- |\n| text       | 点击「添加小程序」，方便下次访问 | 提示语                                                    |\n| type       | bar                              | 【提示框类型】bar：长条型，点击会展示 card 型；card：卡片型（含详细引导步骤） |\n| background | \\#fff (白色)                     | 提示框背景色                                              |\n| customNavbar | false                          | 页面是否使用自定义的导航栏，用于自动定位提示框              |\n| auto       | false                            | 如果为 true，则自动在第一次打开时提示，之后不在展示       |\n| delay      | 0                                | 延迟展示的时间（秒）。默认不延迟       |\n| duration   | 5                                | 展示时长（秒）。之后自动隐藏。0 代表不自动隐藏                              |\n| logo       | 无                               | 用于详细引导步骤中，展示自家小程序 logo                   |\n| name       | 无                               | 用于详细引导步骤中，展示自家小程序名称                    |\n| show       | false                            | 展示提示框                                                |\n| showWhenNotAdded       | false             | 当未添加时展示                                                |\n| showDetail | false                            | 展示详细步骤提示框                                        |\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fliudding%2Fwx-pin-prompt","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fliudding%2Fwx-pin-prompt","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fliudding%2Fwx-pin-prompt/lists"}