如何在NgRx中推送或更新状态？

import { StoreModule } from '@ngrx/store';

@NgModule({
  imports: [
    StoreModule.forRoot({
      // 在这里注册你的reducer
    })
  ]
})
export class AppModule { }

import { createAction, props } from '@ngrx/store';

export const increment = createAction('[Counter Component] Increment');
export const decrement = createAction('[Counter Component] Decrement');
export const reset = createAction('[Counter Component] Reset');

import { createReducer, on } from '@ngrx/store';
import { increment, decrement, reset } from './counter.actions';

export const initialState = 0;

export const counterReducer = createReducer(
  initialState,
  on(increment, state => state + 1),
  on(decrement, state => state - 1),
  on(reset, () => initialState)
);

import { Component } from '@angular/core';
import { Store } from '@ngrx/store';
import { increment, decrement, reset } from './counter.actions';
import { Observable } from 'rxjs';

@Component({
  selector: 'app-counter',
  template: `
    <div>
      <button (click)="increment()">增加</button>
      <div>当前计数: {{ count$ | async }}</div>
      <button (click)="decrement()">减少</button>
      <button (click)="reset()">重置</button>
    </div>
  `
})
export class CounterComponent {
  count$: Observable<number>;

  constructor(private store: Store<{ count: number }>) {
    this.count$ = store.select('count');
  }

  increment() {
    this.store.dispatch(increment());
  }

  decrement() {
    this.store.dispatch(decrement());
  }

  reset() {
    this.store.dispatch(reset());
  }
}