使用 ngrx 的話 還會使用 ngModule 或 reactive forms 嗎?

General
1

請問

使用 ngrx 的話 還會使用 ngModule 或 reactive forms 嗎?

這樣是否違反 ngrx 的 state 變更規則? (依靠 reducer 來變更 state)

如果可以用的話該怎麼配合?

如果不可以用的話是否表單驗證機制都得自行實作?

混著用是否有不良影響?

感謝

2

#結論
ngrx 只是一種 state 的管理方式，他不是要來取代什麼的。所以 ngrx 當然可以跟 Angular 共存

回覆

ngrx 跟 ngModule或是 reactive forms 一點關係都沒有。理由如下

  1. ngModule 是構成 Angular 的基本元素。沒有 ngModule, 就沒有 ngrx的存在
  2. reactive forms 是畫面表單的呈現，這個跟 ngrx 沒有從屬關係。當然可以混搭使用，至於怎麼混合使用，請參考這個影片
    https://www.youtube.com/watch?v=cyaAhXHhxgk

我的看法，這樣子混搭的作法，並沒有簡化程式。除非有 特殊的需求，不然我是不會這樣子寫的。
至於有沒有不良影響，沒實際用過，所以無法分享。

3個讚
3

ngrx 只是名字取的不好而已，單純是 Redux 的模式放進 Angular

// Angular 版
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { StoreModule } from '@ngrx/store';
import { EffectsModule } from '@ngrx/effects';

import { AppComponent } from './app.component';
import { counterReducer, CounterEffects } from './counter';

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    StoreModule.provideStore(counterReducer),
    EffectsModule.run(CounterEffects)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

// Vanilla 版
import { combineReducers, createStore, applyMiddleware } from 'redux';
import { combineEpics, createEpicMiddleware } from 'redux-observable';

import { incrementIfOddEpic, decrementIfEvenEpic, counterReducer } from './counter';

const rootEpic = combineEpics(
  incrementIfOddEpic,
  decrementIfEvenEpic
);

const rootReducer = combineReducers({
  counterReducer
});


const epicMiddleware = createEpicMiddleware(rootEpic);

export const store = createStore(rootReducer, applyMiddleware(epicMiddleware));

我是覺得 Redux 有點 Over Design，像 GraphQL 也有點 Over Design