记状态前端管理库Akita中的一个坑

记状态管理库Akita中的一个坑

Akita是什么

Akita是一种基于RxJS的状态管理模式，它采用Flux中的多个数据存储和Redux中的不可变更新的思想，以及流数据的概念，来创建可观察的数据存储模型。 无论是Angular、React、Vue、Web组件，还是普通的旧式JS，秋田都可以完成繁重的工作，并作为维护干净、无样板、可伸缩的应用程序的有用工具。

Akita基于面向对象的设计原则，而不是函数式编程，因此具有OOP经验的开发人员应该感到很熟悉。它您的团队提供了一个不可偏离的固定模式。

注意一个坑

在创建Entity Store时根据需求您可能需要在@StoreConfig()装饰器中配置Entity Store 的id属性

直接上代码

一段ts代码

import { Todo } from './todo.model';
import { EntityState, EntityStore, StoreConfig } from '@datorama/akita';
​
export interface TodosState extends EntityState<Todo> { }
​
// fixme 注意这里
@StoreConfig({ name: 'todos' })
export class TodosStore extends EntityStore<TodosState, Todo> {
  constructor() {
    super();
  }
}

 

这是一段官方的demo，但是其中有个坑。 若您Entity Store中的实体类型中唯一标识不为id，则需要自己手动设置 Akita @StoreConfig 会默认绑定您实体类型中的id属性作为唯一标识，若 不绑定唯一标识且@StoreConfig又找不到id属性则EntityStore在调用 set存储数据时会出错（但是不会报错。。。。。天坑，不知道时有意为之还是bug）

若唯一标识Entity Id不为id则写为下面这种形式

一段ts代码：

import { Todo } from './todo.model';
import { EntityState, EntityStore, StoreConfig } from '@datorama/akita';

export interface TodosState extends EntityState<Todo> { }

// fixme 注意这里，修改后为
@StoreConfig({ name: 'todos'，idKey: yourId })
export class TodosStore extends EntityStore<TodosState, Todo> {
  constructor() {
    super();
  }
}

 

吐槽一下： 还有就是官网在文档关于这个需要特别注意 事项这个唯一标识绑定的介绍是在创建Entity Store之后的...（坑死欧啦）