{"id":36855278,"url":"https://github.com/laivv/wxbuf","last_synced_at":"2026-01-12T14:42:53.989Z","repository":{"id":236020028,"uuid":"788848079","full_name":"laivv/wxbuf","owner":"laivv","description":"轻量级的微信小程序状态管理与事件通信js库","archived":false,"fork":false,"pushed_at":"2025-07-23T10:29:46.000Z","size":504,"stargazers_count":25,"open_issues_count":2,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-07-23T12:25:23.952Z","etag":null,"topics":["computed","library","mini-app","store","wx-app"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/laivv.png","metadata":{"files":{"readme":"readme.md","changelog":"CHANGE_LOG.md","contributing":null,"funding":null,"license":"LICENSE","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,"zenodo":null}},"created_at":"2024-04-19T07:49:49.000Z","updated_at":"2025-07-08T01:43:19.000Z","dependencies_parsed_at":"2025-07-07T09:23:16.103Z","dependency_job_id":"d9a96cb4-fd5e-4702-bce5-27639d54bfaf","html_url":"https://github.com/laivv/wxbuf","commit_stats":null,"previous_names":["laivv/wxbuf"],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/laivv/wxbuf","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laivv%2Fwxbuf","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laivv%2Fwxbuf/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laivv%2Fwxbuf/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laivv%2Fwxbuf/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/laivv","download_url":"https://codeload.github.com/laivv/wxbuf/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/laivv%2Fwxbuf/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28340403,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-12T12:22:26.515Z","status":"ssl_error","status_checked_at":"2026-01-12T12:22:10.856Z","response_time":98,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.6:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["computed","library","mini-app","store","wx-app"],"created_at":"2026-01-12T14:42:53.870Z","updated_at":"2026-01-12T14:42:53.972Z","avatar_url":"https://github.com/laivv.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# \u003ccenter\u003ewxbuf\u003c/center\u003e\n## v1.1.0-release(2025-7-2)   \n\n\n轻量级的微信小程序状态管理与事件通信javascript库   \n---\n为什么叫`wxbuf`？玩过游戏的都知道加`buff`就是增加状态，变强的意思。这就是取名`wxbuf`的原因。    \n\n\n`wxbuf`对小程序原生API进行了扩展，增加了以下功能：\n* 支持全局状态管理（store）\n* 支持对storage数据进行状态管理\n* 支持按app、page或component来注入全局状态\n* 支持更易用的跨组件跨页面通信方式，彻底解决通信问题\n* 支持store、storage变化监听\n* 更方便的page间数据传递方式\n* 支持组件跨级传递数据\n* Page、Component支持computed计算属性\n* Page支持observers字段监听器\n* 自动反序列化页面url参数中的object、number、null、undefined、array字段，在onLoad钩子中自动接收反序列化后的参数\n* 支持全局生命周期监听\n* 支持全局路由前置守卫钩子、路由变化钩子，方便路由级权限控制\n* 支持全局view标准事件拦截，方便按钮级权限控制\n* 全局开启所有页面的分享功能\n* Component支持更多pageLifeTimes\n* Component支持向所在的父组件挂载方法（类似于vue自定义组件的$ref）\n* 支持全局扩展page、component的实例方法\n* 支持定义顶级全局变量(像使用getApp这类方法一样无需import)\n* 修正wx官方自定义tabbar组件中pageLifetimes.show不工作的问题\n* onLaunch钩子支持返回promise来推迟整个app、页面及组件的加载，适用于需要提前准备好必备数据的场景（解决生命周期异步顺序问题）\n* Page新增onInit钩子，先于onLoad执行，此钩子可以返回promise来推迟页面及组件的加载（解决生命周期异步顺序问题）\n* App新增onPageInit钩子，此钩子可以返回promise来推迟页面及组件的加载（解决生命周期异步顺序问题）\n* 更多功能请查看文档\n---\n \n## 起步\n在app.js文件头部引入:\n```js\n// app.js\nimport wxbuf from 'wxbuf'\n\nApp({\n  globalData: {},\n  onLaunch() {\n\n  }\n    //...\n})\n```\n确保`wxbuf`正确引入，然后开始愉快的使用它   \n\n下面是一个比较丰富的例子，其中使用了大量`wxbuf`的特色功能    \n```js\n// app.js\nimport wxbuf from 'wxbuf'\n\n// wxbuf.config({ /** */}) // 全局配置项\n// wxbuf.watch({ /** */}) // 全局监听器\n// wxbuf.global.extend({ /** */}) // 定义顶级全局变量\n// wxbuf.page.extend({ /** */}) // 全局扩展page实例方法\n// wxbuf.component.extend({ /** */}) // 全局扩展component实例方法\n\nApp({\n  //声明事件监听器\n  listeners: {\n    loginOk(event) {\n      console.log('登录成功')\n      console.log(event.detail.token)\n    }\n  },\n  // 全局数据\n  globalData: {\n    isLogin: false,\n    version: 'app-v1.0'\n  },\n  // 监听storage变化\n  onStorageChange(kvs, oldKvs) {\n    if(Object.keys(kvs).includes('token')) {\n      this.setStore('isLogin', kvs.token ? true : false)\n    }\n  },\n  // 监听全局数据变化\n  onStoreChange(kvs, oldKvs) {\n \n  },\n  // 路由变化钩子\n  onPageShow(page) {\n\n  },\n  // 前置路由守卫钩子， return boolean控制跳转页面\n  beforePageEnter(option, pageConfig) {\n\n  },\n  async onLaunch() {\n    // 获取storage\n    const isLogin = this.getStorageSync('token') ? true : false\n    // 修改全局数据\n    this.setStore('isLogin', isLogin)\n    if(!this.getStore('isLogin')){\n      //打开一个新页面，等待并接收该页面关闭时的回传数据\n     const acceptData = await this.openPage({ url: '/pages/login/index' })\n     console.log(acceptData)\n    }\n  }\n  // ...\n})\n```\n```js\n// pages/login/index.js\nPage({\n  // 声明事件监听器\n  listeners: {},\n  // 同步全局数据\n  mixinStore: [\n    'isLogin',\n    // 与当前page data中的字段冲突，这里重命名\n    'version -\u003e appVersion'\n  ],\n  // 同步storage，假如此时storage中token字段的值为'abc'\n  mixinStorage: ['token'],\n  //storage变化监听\n  onStorageChange(kvs, oldKvs){\n\n  },\n  //全局数据变化监听\n  onStoreChange(kvs, oldKvs){\n\n  },\n  data: {\n    total: 1,\n    version: 'page-v0.5'\n  },\n  // 字段变化监听\n  observers: {\n    total(curVal, oldVal) {\n      console.log('this.data.total被修改', curVal, oldVal)\n    }\n  },\n  //计算属性\n  computed: {\n    totalText() {\n      return `总共${this.data.total}件`\n    }\n  },\n  onLoad() {\n    console.log(this.data.isLogin) // false\n    console.log(this.data.token) // 'abc'\n    console.log(this.data.totalText) // '总共1件'\n    console.log(this.data.version) // 'page-v0.5'\n    console.log(this.data.appVersion) // 'app-v1.0'\n  },\n  handleTap() {\n    if(!this.data.isLogin) {\n      const token = await fetch('/login')\n      // 派发一个事件\n      this.fireEvent('loginOk', token) \n      // 修改storage\n      this.setStorageSync('token', token)\n      // 关闭页面并回传数据\n      this.finish('这条信息将回传')\n    }\n  }\n  // ...\n})\n```\n\n## 快速入门文档\n[快速入门文档](../../blob/master/docs/DOCS.md)\n\n## API文档大全\n[API文档大全](../../blob/master/docs/APIS.md)\n\n## 演示小程序demo\n[小程序demo](../../tree/master/examples/mini-app-demo)\n\n## License\n\n[MIT](https://opensource.org/licenses/MIT)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flaivv%2Fwxbuf","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flaivv%2Fwxbuf","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flaivv%2Fwxbuf/lists"}