奥列利亚状态管理

Question

有没有针对Aurelia的状态管理的最佳实践或库？类似于Vue.js集成的状态管理方式？

我看到有些建议是使用一个简单的对象：

export default {
user: ...,
router: ...,
...,
}

对于一些Aurelia Redux集成，可以参考：https://github.com/steelsojka/aurelia-redux-plugin

有没有使用过一些更简单的库？我觉得Redux的代码量太大了。我想要一个包装器，类似于React中的jumpsuit，具有更小的代码量。

我尝试过多种方法：

store.js

以对象形式存储的store：

export default{
  test: 'xxx'
};

存储为类：

export default class Store{
  constructor() {
    this.test = 'xxx';
  }
};

在组件中，我是这样集成它的：

import { inject } from 'aurelia-framework';
import store from './store';

@inject(store)
export class TestComp {
  constructor(store){
    this.store = store;
  }
}

甚至可以不使用注入:

import store from './store';

export class TestComp {
  constructor(){
    this.store = store;
  }
}

所有组合看起来都正常工作，并且在视图/组件之间保持同步。

一个方法相对于另一个的(不)优点是什么？或者你是否建议从一开始就采用完全不同的方法？

- Chris

---

你不能只将一个对象注册为单例并将其注入到你的类中吗？你对此有疑虑吗？ - Fabio Luz

@FabioLuz 这正是我目前正在做的事情，但它似乎太简单和直接了当了... 我担心这是糟糕的设计 :) - Chris

好的，我不认为这是一个糟糕的设计。请发布您当前的解决方案，以便我们在必要时提出改进建议。 - Fabio Luz

@FabioLuz，我刚刚更新了问题。 - Chris

Answer 1

另一种方法是继续使用传统的服务，但只通过操作更改存储中的单个状态。您可以在此处找到有关此方法的文章 http://pragmatic-coder.net/using-a-state-container-with-aurelia/。此方法的核心使用了 RxJS BehaviorSubject，可订阅以使组件与状态同步。除此之外，与使用 Redux 并需要重写应用程序相比，它还提供了更简单的现有应用程序升级路径。还有，它也支持Redux DevTools ;)

- zewa666

Answer 2

同时，官方发布了 Aurelia-Store，这是一个用于状态管理的官方 Aurelia 插件。请查看文档以了解其工作原理。

- zewa666

Answer 3

我选择了类方法，然后在需要的地方注入该类。

import {observable} from 'aurelia-framework';
import {Cookie} from 'aurelia-cookie';

export class AppConfig {

  @observable companyCode;
  @observable applCodeInUse;
  @observable theme;

  constructor() {
    // Set up properties in here
  }

  // Some functions used for value conversion

}

因为注入的类被视为单例，所以您只需注入AppConfig类并访问其属性即可。

import {inject, NewInstance, ObserverLocator} from 'aurelia-framework';
import {AppConfig} from 'config/AppConfig';

@inject(AppConfig)
export class Form {
    constructor(appConfig) {
       this.appConfig = appConfig;
    }
} 

这显然与你的解决方案非常相似。我使用了一个类，因为有一些业务逻辑用于转换值等。

你似乎怀疑这是否是糟糕的设计，但是 Aurelia 的重点是只要你的代码遵循标准，那么你可以自由地使用任何约定来实现你的结果。据我所知，这种方法并没有违反最新的 JS 标准。它还轻量级和灵活。我认为这没有问题。

- Tom

Answer 4

您可以在http://patrickwalters.net/my-best-practices-in-aurelia/中了解更多相关信息。

我建议使用inject。

- Joao Martins