mobxで計算/観測値を使用する場合

Question

私はmobxのほとんどを得ているように感じますが、何かを明確にしたいと思います。私はのコアは、オブジェクトの配列（typescriptです）で、いくつかの観測で店を持っている：

class ClientStore { 
    constructor() { 
     this.loadClients(); 
    } 

    @observable private _clients: IClient[] = []; 
    @computed get clients() { 
     return this._clients; 
    } 
    @observable isFetching: boolean = false; 
    @observable sortField: 'title' | 'modified' = 'modified'; 
    @observable sortDescending: boolean = true; 

    getClientByUrlName(urlName: string): IClient { 
     return this._clients.find(c => c.urlName === urlName); 
    } 
etc... 

私の質問は、その最後の関数である - getClientByUrlName。それは観察可能なものからのものなので、その関数を使用している@ observer反応コンポーネントは正しく再レンダリングされます。このようなことのために、この慣用的なmobxですか？それは計算された値でなければならないと感じます。私はそれを使用したいコンポーネントの計算値ですか？

//import singletone ClientStore 
class ClientDetailsView extends React.Component<{params:{urlName:string}}, void> { 

    @computed get client() { 
     return ClientSotre.clients.find(c => c.urlName === this.props.params.urlName); 
    } 

...rest of react component 

ここでは、ベストプラクティスと問題点を探しています。どんな助けもありがとうございます。

*原則として@computedで編集固定コードのサンプルエラー

Answer 1

はMobXを伝えるシンプルなディレクティブです：「この値が変更を使用している観測のいずれかまでキャッシュすることができました」。だから、実際にはそれらは常に省略することができます。それはあなたのアプリがもっと再計算されることを意味するだけですが、結果を変更することはありません。

したがって、ほとんどの場合問題にならない機能には@computedが不足しています。そうである場合は、createTransformerを使用して1つの引数の関数を取り、計算値のmemoizationキャッシュ（自己クリーニング）を構築することができます。しかし、それは少し複雑ですので、実際にはClientDetailsViewに計算されたプロパティを導入するあなたのソリューションは良いです。私は確かにあなたがその計算されたプロパティ（この場合にそれを必要とするコンポーネント）を配置するための素晴らしい場所を持っている限り、それを行うことをお勧めします