NGRX 5 管道选择器
NGRX 5 piped selector
在关于 medium.com(2 月 13 日)的 this 文章中,他们提供了关于 NGRX 5 的管道选择器。这让我想起了在阅读 rxjs 中的可管道选择器时,它们不仅可以通过 'its pure function, bro' 来证明,而且还可以在不同的事件中声明和重用函数,而无需每次都使用 map 来调用可让函数。
所以我同意,这在 rxjs 中是一件好事,但为什么我们在 ngrx 中需要它 - 对于选择器。链接的文章显示了以下示例:
import { Store, select } from '@ngrx/store';
import { Observable } from 'rxjs/Observable';
interface AppState {
count: number;
}
@Component({
selector: 'my-app',
template: `
<button (click)="increment()">Increment</button>
<div>Current Count: {{ count$ | async }}</div>
<button (click)="decrement()">Decrement</button>
<button (click)="reset()">Reset Counter</button>
`
})
export class MyAppComponent {
count$: Observable<number>;
constructor(private store: Store<AppState>) {
this.count$ = store.pipe(select('count'));
}
}
所以我们现在调用 store.pipe(select(...));
而不是 store.select(Selector);
- 收益在哪里?为什么我应该更改我的代码以使用此行为或至少开始使用可管道选择器?
在 NgRx 7 中,此弃用已恢复 - see changelog。
在关于 medium.com(2 月 13 日)的 this 文章中,他们提供了关于 NGRX 5 的管道选择器。这让我想起了在阅读 rxjs 中的可管道选择器时,它们不仅可以通过 'its pure function, bro' 来证明,而且还可以在不同的事件中声明和重用函数,而无需每次都使用 map 来调用可让函数。
所以我同意,这在 rxjs 中是一件好事,但为什么我们在 ngrx 中需要它 - 对于选择器。链接的文章显示了以下示例:
import { Store, select } from '@ngrx/store';
import { Observable } from 'rxjs/Observable';
interface AppState {
count: number;
}
@Component({
selector: 'my-app',
template: `
<button (click)="increment()">Increment</button>
<div>Current Count: {{ count$ | async }}</div>
<button (click)="decrement()">Decrement</button>
<button (click)="reset()">Reset Counter</button>
`
})
export class MyAppComponent {
count$: Observable<number>;
constructor(private store: Store<AppState>) {
this.count$ = store.pipe(select('count'));
}
}
所以我们现在调用 store.pipe(select(...));
而不是 store.select(Selector);
- 收益在哪里?为什么我应该更改我的代码以使用此行为或至少开始使用可管道选择器?
在 NgRx 7 中,此弃用已恢复 - see changelog。