寻找使用ngrx 8进行immer produce的示例

npm install @ngrx/store @ngrx/effects immer

import produce from 'immer';

// 定义初始状态
const initialState = {
  count: 0
};

// 创建reducer函数
export function counterReducer(state = initialState, action) {
  return produce(state, draft => {
    switch (action.type) {
      case 'INCREMENT':
        draft.count++;
        break;
      case 'DECREMENT':
        draft.count--;
        break;
      default:
        break;
    }
  });
}

import { StoreModule } from '@ngrx/store';
import { counterReducer } from './counter.reducer';

@NgModule({
  imports: [
    StoreModule.forRoot({ counter: counterReducer })
  ]
})
export class AppModule { }

import { Component } from '@angular/core';
import { Store } from '@ngrx/store';

@Component({
  selector: 'app-counter',
  template: `
    <div>
      <button (click)="increment()">Increment</button>
      <span>{{ count$ | async }}</span>
      <button (click)="decrement()">Decrement</button>
    </div>
  `
})
export class CounterComponent {
  count$ = this.store.select(state => state.counter.count);

  constructor(private store: Store) {}

  increment() {
    this.store.dispatch({ type: 'INCREMENT' });
  }

  decrement() {
    this.store.dispatch({ type: 'DECREMENT' });
  }
}