{"id":13511376,"url":"https://github.com/wwayne/minii","last_synced_at":"2025-04-23T13:31:52.788Z","repository":{"id":33695953,"uuid":"155051878","full_name":"wwayne/minii","owner":"wwayne","description":"State management for Wechat Mini App 小程序状态管理","archived":false,"fork":false,"pushed_at":"2023-04-29T18:05:04.000Z","size":959,"stargazers_count":65,"open_issues_count":7,"forks_count":12,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-11-01T13:34:49.086Z","etag":null,"topics":[],"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/wwayne.png","metadata":{"files":{"readme":"README-EN.md","changelog":null,"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}},"created_at":"2018-10-28T08:54:22.000Z","updated_at":"2024-08-22T08:26:04.000Z","dependencies_parsed_at":"2024-01-13T19:42:46.862Z","dependency_job_id":null,"html_url":"https://github.com/wwayne/minii","commit_stats":null,"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wwayne%2Fminii","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wwayne%2Fminii/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wwayne%2Fminii/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/wwayne%2Fminii/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/wwayne","download_url":"https://codeload.github.com/wwayne/minii/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":223739574,"owners_count":17194632,"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":[],"created_at":"2024-08-01T03:00:48.695Z","updated_at":"2024-11-10T07:32:35.904Z","avatar_url":"https://github.com/wwayne.png","language":"JavaScript","funding_links":[],"categories":["mini-programe"],"sub_categories":[],"readme":"# Minii\n\n[![Version](http://img.shields.io/npm/v/minii.svg)](https://www.npmjs.org/package/minii)\n[![js-standard-style](https://img.shields.io/badge/code%20style-standard-brightgreen.svg?style=flat)](https://github.com/feross/standard)\n[![npm download][download-image]][download-url]\n[![Build Status](https://travis-ci.org/wwayne/minii.svg?branch=master)](https://travis-ci.org/wwayne/minii)\n\n[download-image]: https://img.shields.io/npm/dm/minii.svg?style=flat-square\n[download-url]: https://npmjs.org/package/minii\n\n## Who's using\n![mp qrcode](https://user-images.githubusercontent.com/5305874/87665910-497c5f00-c79a-11ea-8326-86d7502aa8a9.jpg)\n![gh_f977d523b1b8_258](https://user-images.githubusercontent.com/5305874/56073712-19961d00-5ddb-11e9-8b3b-70a40b9c1aa8.jpg)\n\n[简体中文](./README.md) | English\n\n## Why\n\n* `Tiny Size`: after importing into the app, the package's size is smaller than 1kb\n* `Simple Usage`: only 2 API for state management binding\n\n## Installation\nThe base library should greater than 2.2.1\n\n1. `$ npm install minii --production`\n\n2. In WeChat Developer Tool, Tools -\u003e build npm\n\n3. In WeChat Developer Tool, Details -\u003e check `Use NPM module`\n\nOfficial doc: [how to use npm in wechat](https://developers.weixin.qq.com/miniprogram/dev/devtools/npm.html?t=18082018)\n\n## How to use\n#### 1. Create store for observing data\n```JS\n// stores/user.js\n\nimport { observe } from 'minii'\n\nclass UserStore {\n  constructor () {\n    this.name = 'A'\n  }\n\n  changeName (name) {\n    this.name = name\n  }\n}\n\n// the second params 'user' gonna bind this store's attributes into globalState.user\n// if the second params is empty, the lowercase of the class name will be used\nexport default observe(new UserStore(), 'user')\n```\n\n#### 2. Bind state into page\n```JS\nimport { mapToData } from 'minii'\nimport userStore from '../../stores/user'\n\nconst connect = mapToData(function (state, opt) {\n  // opt is the same one in onLoad(opt)\n  // using this.data to get current page's data\n  return {\n    myName: state.user.name\n  }\n))\n\n// Same for Component\nPage(connect({\n  onChangeName () {\n    userStore.changeName('B')\n  }\n}))\n```\n\n#### 3. Use the bound state in the page\n```html\n\u003cview\u003e\n  \u003ctext\u003eMy name\u003c/text\u003e\n  \u003ctext\u003e{{ myName }}\u003c/text\u003e\n  \u003cbutton bindtap=\"onChangeName\"\u003eChange Name\u003c/button\u003e\n\u003c/view\u003e\n```\n\n#### 4. We need require store when launching the app (this is only for `observe`)\nCreating a file to import all stores is recommended, e.g.：\n\n```js\n/stores\n  user.js\n  shop.js\n  index.js\napp.js\n```\n\nimport all stores in stores/index.js\n\n```js\nexport userStore from './user'\nexport shopStore from './shop\n```\n\nrequire this file in mini-app's app.js\n\n```js\nrequire('./stores/index')\n```\n\n## API\n#### mapToData\n\n`mapToDate` is for connecting state into page's data, you can think about it like `connect` in react-redux. After observing a store `observer(instance, 'user')`, we can get the store's state by `state.user`\n\n#### observe\n\n`observe` is for binding the store's attribute into the global state and observe the changes. While changing the store's observed attributes will lead pages' update.\n\nOnly changing store's attribute through store's instance methods is recommened\n\n\n## Deployment\n1. `$ npm run build`\n2. `$ npm publish`\n\n## License\n\nMIT\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwwayne%2Fminii","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwwayne%2Fminii","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwwayne%2Fminii/lists"}