欢迎光临散文网 会员登陆 & 注册

Vue生态之Pinan状态管理器

2023-01-30 12:12 作者:一行小诗  | 我要投稿

        Pinia作为Vue的新一代的状态管理器,Store (如 Pinia) 是一个保存状态和业务逻辑的实体,它并不与你的组件树绑定。换句话说,它承载着全局状态。它有点像一个永远存在的组件,每个组件都可以读取和写入它。它有三个概念,state、getter 和 action,我们可以假设这些概念相当于组件中的 data、 computed 和 methods。

安装


创建实例并挂在到Vue中

Pinia几个属性

        State:在大多数情况下,state 都是核心,state 被定义为一个返回初始状态的函数,函数返回的对象的属性就是我们要管理的数据。

        Getter: 定义方法表达式,可以理解为只读state,通过表达式计算state值,返回给调用者。官网推荐使用箭头函数,并且它将接收 state 作为第一个参数。

        Actions:用来定义处理业务逻辑函数的,默认是同步函数,如果使用async关键字可以定义异步函数。如果要使用this关键字,则不能使用箭头函数。

定义一个模块

如何使用

        组件中引入我们定义好的模块后,可以在模板表达式中直接访问state值,这样的方式是是允许的。

直接访问state

        也可以通过Getter函数访问

通过getter访问state



Vue生态之Pinan状态管理器的评论 (共 条)

分享到微博请遵守国家法律