如何将道具从mobx-observable传递给mobx-react observable?

如何将道具从mobx-observable传递给mobx-react observable?

问题描述:

我找不出mobx反应的...如何将道具从mobx-observable传递给mobx-react observable?

我如何通过道具从mobx可观察到mobx反应的观察?

下面的代码不起作用,但我觉得它应该。有人能告诉我发生了什么问题吗?

let mobxData = observable({information: "this is information"}); 

@observer class Information extends React.Component { 
    render() { 
     console.log(this.props.mobxData.information); 
     return (
      <h1>class: {this.props.mobxData.information}</h1> 
     ) 
    } 
}; 

const StatelessInformation = observer(({mobxData}) => { 
    console.log(mobxData.information); 
    return <h1>stateless: {mobxData.information}</h1> 
}); 

ReactDOM.render(
    <div> 
     <Information/> 
     <StatelessInformation/> 
    </div>, 
    document.getElementById('app') 
); 
+1

我不太清楚你在问什么。 [**它适用于我**](http://jsbin.com/jeyagesira/edit?js,output)。 – Tholle

+0

感谢您创建JSBin。我明白如果你通过它们通过它父母它的作品,但不应该mobx照顾这个? – joeydebreuk

+0

我想这是我出错的地方。 – joeydebreuk

我没有做什么mobx最近和没有测试过这一点,但通常你有一个供应商的地方,然后使用@inject通过商店道具

消费者的信息:

import { observer, inject } from 'mobx-react' 

@inject('information') 
@observer 
class Information extends React.Component { 
    render(){ 
    {this.props.information.foo} 
    } 
} 

模型级 - 非常基本的

import { observable, action } from 'mobx' 

class Information { 
    @observable foo = 'bar' 
    @action reset(){ 
    this.foo = 'foo' 
    } 
} 

export new Information() 

根提供商水平

import { Provider } from 'mobx-react' 
import Information from ./information' 

<Provider information={Information}> 
    <Information /> 
</Provider> 

// test it... 
setTimeout(() => { 
    Information.foo = 'back to foo' 
}, 2000) 

但最终你也许可以用你的提供商

传进去的引擎盖下工作,提供者是可能只是通过childContextTypecontextType通过context当HOC memoises并映射到props

+0

干杯。我认为mobx会照顾到这一点。再次感谢! – joeydebreuk