Aurelia государственное управление

Question

Есть ли какие-либо лучшие практики или библиотека для государственного управления в аурелии? что-то вроде интегрированного управления государством vue.js?

Я видел несколько предложений, начиная от простого объекта:

экспорта по умолчанию { пользователя: ... маршрутизатора: ..., ... }

некоторого Aurelia сокращение: https://github.com/steelsojka/aurelia-redux-plugin

Неужели кто-нибудь сделал хорошую работу с библиотекой с меньшей сложностью? На мой взгляд, Redux - это многого. Я бы хотел, чтобы какая-то обертка с меньшим размером, похожим на комбинезон для реакции.

я использовал несколько попыток:

store.js

магазин как объект:

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; 
    } 
} 

или даже без Inject:

import store from './store'; 

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

Все комбинации, кажется, работают очень хорошо, и магазин хранит в синхронизации между Views/Components.

Каковы преимущества (отличия) одного от другого ... или вы бы предложили совершенно другой подход в первую очередь?

Answer 1

Вы можете прочитать об этом в http://patrickwalters.net/my-best-practices-in-aurelia/

Я хотел бы предложить использовать инъекции.

Answer 2

Я пошел для метода класса, а затем ввел класс как и где мне это нужно.

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. Он также легкий и гибкий. Я не вижу проблем с этим.

Answer 3

Другой подход заключается в том, чтобы продолжать использовать классические сервисы и все же иметь одно состояние в магазине, которое изменяется только посредством действий.Вы можете найти статью об этом здесь http://pragmatic-coder.net/using-a-state-container-with-aurelia/. Этот подход использует объект поведения RxJS BehaviorSubject в ядре, на который подписаны, чтобы компоненты синхронизировались с состоянием. Кроме того, он предлагает более простой путь обновления для существующих приложений по сравнению с использованием redux и переписывает ваше приложение. Поддержка Oh и Redux DevTools также включена;)

Answer 4

Если вы пишете в машинописном машиностроении и заинтересованы в использовании сокращений в менее подробном и более объектно-ориентированном виде, вы должны проверить redux-app.

Вот краткий пример:

@component 
class App { 
    counter = new Counter(); 
} 

@component 
class Counter { 
    value = 0; 

    increment() { 
     this.value = this.value + 1; 
    } 
} 

const app = new ReduxApp(new App()); 

console.log(app.root.counter.value); // 0 
console.log(app.store.getState()); // { counter: { value: 0 } } 

app.root.counter.increment(); // will dispatch COUNTER.INCREMENT redux action 

console.log(app.root.counter.value); // 1 
console.log(app.store.getState()); // { counter: { value: 1 } } 

Хотя он работает с другими структурами, а также, есть много examples с использованием Aurelia.

Полное раскрытие информации, я являюсь автором библиотеки.