为什么与'when'工作和'observe'或'intercept`不一致？

Question

Mobx-utils/fromPromise.state不可观察！

const { observable, when, reaction, intercept, observe, isObservable } = mobx; 
 
const { fromPromise, whenWithTimeout } = mobxUtils; 
 

 
const promise = fetch('https://jsonplaceholder.typicode.com/todos') 
 
    .then(res => res.json()) 
 
const result = fromPromise(promise); 
 

 
console.assert(isObservable(result.state), 'state is NOT an isObservable'); 
 

 
/* WORKS! 
 
when(
 
() => result.state !== "pending", 
 
() => { 
 
    console.log("Got ", result.value) 
 
    } 
 
); 
 
*/ 
 

 
// NOT WORK, Why ? 
 
observe(result, 'state', change => (console.log('observe', change)), true) 
 
intercept(result, 'state', change => (console.log('intercept', change))); 
 
reaction(
 
() => result.state, 
 
    state => console.log('reaction', state) 
 
);

<script src="https://unpkg.com/mobx@3/lib/mobx.umd.js"></script> 
 
<script src="https://unpkg.com/mobx-utils/mobx-utils.umd.js"></script>

Answer 1

result.state是观察不到的，但如果你在its implementation看一看，你会看到，当你做result.state它访问观察到result._state。

private _state: IObservableValue<PromiseState> = observable(PENDING as any); 
.... 
get state(): PromiseState { 
    return this._state.get(); 
} 

reaction和when工作，因为它们反应_state访问，当你阅读state恰好。这清楚地解释了in the documentation。

observe和intercept不起作用，因为result不可观察。他们期望他们的第一个参数是可观察。因此，即使更新的代码将无法正常工作

observe(result, '_state', change => (console.log('observe', change)), true) 
intercept(result, '_state', change => (console.log('intercept', change))); 

要修复它传递result._state作为第一个参数。

observe(result._state, change => (console.log('observe', change)), true) 
intercept(result._state, change => (console.log('intercept', change)));