记状态管理库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之后的...(坑死欧啦)

记前端状态管理库Akita中的一个坑的更多相关文章

  1. 网页前端状态管理库Redux学习笔记(一)

    最近在博客园上看到关于redux的博文,于是去了解了一下. 这个Js库的思路还是很好的,禁止随意修改状态,只能通过触发事件来修改.中文文档在这里. 前面都很顺利,但是看到异步章节,感觉关于异步说得很乱 ...

  2. React 新 Context API 在前端状态管理的实践

    本文转载至:今日头条技术博客 众所周知,React的单向数据流模式导致状态只能一级一级的由父组件传递到子组件,在大中型应用中较为繁琐不好管理,通常我们需要使用Redux来帮助我们进行管理,然而随着Re ...

  3. vue组件化开发-vuex状态管理库

    Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化.Vuex 也集成到 Vue 的官方调试工具 ...

  4. 比Redux更容易上手的状态管理库

    前言 当项目越发复杂时,我们发现仅仅是提升状态已经无法适应如此复杂的状态管理了,程序状态变得比较难同步,操作,到处是回调,发布,订阅,这意味着我们需要更好的状态管理方式,于是就引入了状态管理库,如Re ...

  5. 轻量级状态管理库Pinia试吃

      最近连续看了几个GitHub上的开源项目,里面都用到了 Pinia 这个状态管理库,于是研究了一下,发现确实是个好东西!那么,Pinia 的特点: 轻量化 -- Pinia 体积约1KB,十分轻巧 ...

  6. andriod8.1.0源码编译中的一个坑-package com.sun.javadoc does not exist

    这里记录编译过程中的一个坑!!! 编译过程中出现了下面的报错 external/doclava/src/com/google/doclava/ClassInfo.java:20: error: pac ...

  7. xcode中得一个坑

    因项目需求变动,我必须在coredata中的WorkLogModel表中添加一个字段:抄送人.起初我给这个字段起名为copyPerson,一切准备就绪后,发现从数据库读取这个copyPerson时,第 ...

  8. PHP中的一个”坑“

    说一个极有可能在工作中遇到的问题——foreach的引用 foreach $arr = range(1,3); //[1,2,3] foreach($arr as &$val) { } for ...

  9. Spring Boot 计划任务中的一个“坑”

    计划任务功能在应用程序及其常见,使用Spring Boot的@Scheduled 注解可以很方便的定义一个计划任务.然而在实际开发过程当中还应该注意它的计划任务默认是放在容量为1个线程的线程池中执行, ...

随机推荐

  1. Element UI table组件源码分析

    本文章从如下图所示的最基本的table入手,分析table组件源代码.本人已经对table组件原来的源码进行削减,源码点击这里下载.本文只对重要的代码片段进行讲解,推荐下载代码把项目运行起来,跟着文章 ...

  2. 为什么你应该使用OpenGL而不是DirectX?

    这是一篇很意思的博文,原文链接为:http://blog.wolfire.com/2010/01/Why-you-should-use-OpenGL-and-not-DirectX 大家可以思考一下: ...

  3. vue-cli3 关闭eslint

    关闭eslint 直接注释掉package.json文件中eslint的配置就可以了(以下是vue-cli的默认配置) "eslintConfig": { "root&q ...

  4. 【JZOJ4896】【NOIP2016提高A组集训第16场11.15】兔子

    题目描述 在一片草原上有N个兔子窝,每个窝里住着一只兔子,有M条路径连接这些窝.更特殊地是,至多只有一个兔子窝有3条或更多的路径与它相连,其它的兔子窝只有1条或2条路径与其相连.换句话讲,这些兔子窝之 ...

  5. JMeter与LoadRunner的对比

    1. 界面.安装.协议支持.函数库.成本.开源 2. 都可以实现分布式负载,相对来说LoadRunner更强大一些 3. 都支持在windows和linux环境的负载生成器.控制台方面,Jmeter跨 ...

  6. 【记录bug】npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.7 (node_modules\fsvents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents1.2.7: wanted {"os":"darwin

    npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.7 (node_modules\fsvents): npm WARN nots ...

  7. bzoj1221 软件开发

    Description 某软件公司正在规划一项n天的软件开发计划,根据开发计划第i天需要ni个软件开发人员,为了提高软件开发人员的效率,公司给软件人员提供了很多的服务,其中一项服务就是要为每个开发人员 ...

  8. UVA_401:Palindromes

    AC:Time(29ms)     C++ 4.8.2 #include<stdio.h> #include<string.h> char * mirstr = "A ...

  9. MyBatis映射文件的基本功能

    #{}与${}区别 "#{}"使用的是preparedStatement方式预处理,就是使用了占位符来填充数据防止SQL注入. ${}使用的是statement方式进行sql语句的 ...

  10. HDU-1260_Tickets

    Tickets Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Problem Des ...