MobXのイベント：ストアのアクションからのビューの呼び出し

Question

MobXのストアの非同期アクションからのビューの方法をどのように呼びますか？例えば、私はこのようなコードを、している：関数が成功したか失敗した場合は、ビュー内のいくつかの方法は、例えば、エラーダイアログを表示したりNavigatorにpushメソッドを呼び出して、

@action 
someAction() { 
    longOperation() 
    .then(() => { }) 
    .catch(error => { }); 
} 

と呼ばれるべきです。

現在、私は考えている：ステータスで店舗に観測可能なフィールドを作成する。ステータスが変更されると、私のビューのrenderメソッドが呼び出され、発生したアクションを処理し、ストアのステータスをリセットできます。

しかし、このアイデアの実装にはより良いバリエーションがありますか？

Answer 1

return the promise from the action and just do what you want once it has resolvedです。

例

function longOperation() { 
    return new Promise(resolve => setTimeout(resolve, 3000)); 
} 

class Store { 
    @observable data = 'foo'; 
    @action 
    someAction() { 
    return longOperation() 
     .then(() => this.data = 'bar') 
     .catch(e => console.log(e)); 
    } 
} 

const store = new Store(); 

@observer 
class App extends React.Component { 
    @observable stuff = 'test'; 
    onClick =() => { 
    store.someAction().then(() => this.stuff += '!'); 
    }; 
    render() { 
    return (
     <div onClick={this.onClick}> 
     {`${this.stuff} ${store.data}`} 
     </div> 
    ); 
    } 
} 

ReactDOM.render(
    <App />, 
    document.getElementById('app') 
);