小程序状态管理库-Minax

小程序状态管理库-Minax,第1张

Minax是一个专为小程序开发的状态管理库,它采用集中式存储管理应用的所有组件的状态,

并能够配置是否与缓存做绑定,使用方式类似与Vuex。通常可以用来解决多个试图共享同一

状态或者多个试图需要变更同一状态的场景。

针对2.2.1以下基础库版本,请将本库的dist目录复制到您的项目中,然后适用require或者import的方式引用即

或者

由于小程序的文件夹默认不采用npm的形式,所以第一步需要将小程序项目初始化成npm项目

然后根据你的包管理工具使用

或者

安装成功后,点击开发者工具中的菜单栏:工具 -->构建 npm

勾选“使用 npm 模块”选项:

构建完成后即可使用 npm 包,js 中引入 npm 包:

Minax库的核心就是store(仓库)。“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state以及action)。

Minax 和单纯的全局对象有以下两点不同:

Minax 的状态存储是基于发布订阅模式的,当页面或组件从 中设置了 mapState 时,相当于向store订阅了该状态,若 store 中的状态发生变化,那么相应的郑烂雹组件、页面也会相应地得到高效更新。

你不能直接改变 store 中的状态,改变 store 中的状态的唯一途径就是显式地提交发布 (commit),这样使得我们可以方便地跟踪每一个状态的变化。

我们建议在项目建一个store/index.js文件,一个简单的store编写如下:

现在,你可以通过 store.state 来获取状态对象,以及通过 store.commit 方法触发状态变更:

在项目的app.js中,将store引入

在Page、Component、Behavior中配置mapState属性,其对应的值为一个字符串或者字符串数组

mapState: ['cartCount', 'mark'],

或者

mapState: 'cartCount',经mapState处理过的属性等效于设置月data中,您可以通过this.data.cartCount获取,也可以通过this.$store.state.cartCount获取

在wxml中,直接绑定改值既可

看到这里,你应该已经基本掌握本库的使用了

state是Minax的全部状态源,我们通过在state中设置的key来绑定状态,其有两个特性:

Minax支持于历凯缓存喊帆绑定的模式,这一点你只需要知道即可,因为你无需 *** 作缓存,这一切都由store帮你做好,初始化时会自动读取,更新时会自动写入,而你要做的知识在bindStorageMode等于true时,配置state的持久化属性即可

action通常用于处理异步事物(你实在要同步使用我也没办法)

使用时

好啦,暂时先到这里,你可以愉快的coding啦

1、打开微信的发现界面,点击小程序。

2、进入小搜蚂顷程序系统,点击我的小世陆程序。

3、跳转界面,点击上方的编辑图标。

4、点击小程序的去除图物森标可以删除小程序,点击后方的三可以移动顺序。

5、完成编辑之后,点击完成即可。

腾讯原生小程序培哪框架 OMIX2.0现在支持的是在页面中去使用状态管理,但实际工作中很多情况下需要我们在app.js中就去使用状态管理,比如说在onLaunch中我们需要授权登录并且获取用户的信息,这些就核纳会需要在获取后用状态管理及时存储,方便以后的使用。所以我们需要对其改装。

目前我使用的是2.4.0版本,如果不知道的话可以在utils中的create.js中最上面注释查看版本号。

打开create.js,找到create方法。

将if语句中的 Page(option)放入create.Page中

这样就配氏码可以在app.js中使用了,引入create.js和store中的index.js.在app.js中直接写store.data.xxx就好


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/12494607.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-25
下一篇 2023-05-25

发表评论

登录后才能评论

评论列表(0条)

保存