记状态管理库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. 2018-5-22-SublimeText-粘贴图片保存到本地

    title author date CreateTime categories SublimeText 粘贴图片保存到本地 lindexi 2018-05-22 15:15:26 +0800 2018 ...

  2. Leetcode836.Rectangle Overlap矩阵重叠

    矩形以列表 [x1, y1, x2, y2] 的形式表示,其中 (x1, y1) 为左下角的坐标,(x2, y2) 是右上角的坐标. 如果相交的面积为正,则称两矩形重叠.需要明确的是,只在角或边接触的 ...

  3. 【转】Jython安装(Win)

    ython的安装比较简单,Jython的安装程序本身就是一个Java应用程序,因此,在安装之前,你必须具备Java运行的环境.下面以 Jython的Jython2.2.1为例,说明Jython的安装步 ...

  4. Directx11教程(64) tessellation学习(6)-PN Triangles

    原文:Directx11教程(64) tessellation学习(6)-PN Triangles       前面我们用tessellation细分三角形或者四边形,产生的细分点都是在三角形或四边形 ...

  5. Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第十九章:法线贴图

    原文:Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第十九章:法线贴图 学习目标 理解为什么需要法线贴图: 学习法线贴图如 ...

  6. mac下的抓包工具Charles

    在mac下面,居然没有好的抓包工具,这让我十分纠结,毕竟不可能为了抓一个http包就跑到win下折腾.或许有人说tcpdump这么好的工具,你怎么不用.说实话,tcpdump太复杂了,我还没有细看,再 ...

  7. 2019-8-30-C#-从零开始写-SharpDx-应用-笔刷

    title author date CreateTime categories C# 从零开始写 SharpDx 应用 笔刷 lindexi 2019-8-30 8:50:0 +0800 2019-6 ...

  8. PHP实现redis限制单ip、单用户的访问次数功能

    本文实例讲述了PHP实现redis限制单ip.单用户的访问次数功能.分享给大家供大家参考,具体如下: 有时候我们需要限制一个api或页面访问的频率,例如单ip或单用户一分钟之内只能访问多少次 类似于这 ...

  9. Pycurl介绍

    pycurl — A Python interface to the cURL library Pycurl包是一个libcurl的Python接口.pycurl已经成功的在Python2.2到Pyt ...

  10. 微信小程序错误——mpvue小程序:未找到 app.json 中的定义的 pages "pages/XXX/XXX" 对应的 WXML 文件

    背景 在刚开始学习开发小程序时,使用微信开发工具在app.json建立页面,写好配置文件名称后,应该会自动生成页面的4个文件,结果没有生成文件,反而报错:mpvue小程序:未找到 app.json 中 ...