【小程序】全局数据共享
目次全局数据共享
1. 什么是全局数据共享
2. 小程序中的全局数据共享方案
全局数据共享 - MobX
1. 安装 MobX 相干的包
2. 创建 MobX 的 Store 实例
3. 将 Store 中的成员绑定到页面中
4. 在页面上使用 Store 中的成员
5. 将 Store 中的成员绑定到组件中
6. 在组件中使用 Store 中的成员
全局数据共享
1. 什么是全局数据共享
全局数据共享(又叫做:状态管理)是为了办理组件之间数据共享的问题。
开发中常用的全局数据共享方案有:Vuex、Redux、MobX 等。https://i-blog.csdnimg.cn/blog_migrate/b334a74e27626147bd307a26108344ae.png
2. 小程序中的全局数据共享方案
在小程序中,可使用 mobx-miniprogram 共同 mobx-miniprogram-bindings 实现全局数据共享。其
中:
mobx-miniprogram 用来创建 Store 实例对象
mobx-miniprogram-bindings 用来把 Store 中的共享数据或方法,绑定到组件或页面中使用https://i-blog.csdnimg.cn/blog_migrate/c3afa08872268fa1d9e8b375db5130ea.png
全局数据共享 - MobX
1. 安装 MobX 相干的包
在项目中运行如下的命令,安装 MobX 相干的包:
https://i-blog.csdnimg.cn/blog_migrate/1b874892b194ba64f0836f04bd356734.png
留意:MobX 相干的包安装完毕之后,记得删除 miniprogram_npm 目次后,重新构建 npm。
2. 创建 MobX 的 Store 实例
https://i-blog.csdnimg.cn/blog_migrate/60f8b091a9a948f94d3ae8064e1538aa.png
3. 将 Store 中的成员绑定到页面中
https://i-blog.csdnimg.cn/blog_migrate/4d28dbab5fdd29ea77955a8a0e7b4c82.png
4. 在页面上使用 Store 中的成员
https://i-blog.csdnimg.cn/blog_migrate/39ec79a7ca5c8503b4e1543aeffe396e.png 5. 将 Store 中的成员绑定到组件中
https://i-blog.csdnimg.cn/blog_migrate/1d6ffbfe28cf70f58f94f9270d381985.png
6. 在组件中使用 Store 中的成员
https://i-blog.csdnimg.cn/blog_migrate/5ade9cb89501173f5372fc479f4b3a59.png
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页:
[1]