如何將mobx-observable中的道具傳遞給mobx-react observable？

Question

我無法弄清楚mobx-react ......

如何將mobx observable中的道具傳遞給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')
);

Answer 1

我最近沒有做太多的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)

但最終你可以使用你在提供者中傳遞的任何東西

在引擎蓋下，當HOC記憶它並映射到props時，提供者可能只是通過childContextType和contextType傳遞context 。