通过mobx商店和道具来运作

时间:2017-11-29 18:40:37

标签: javascript reactjs mobx mobx-react

我有一个调用函数的React组件,我需要将注入的mobx存储和组件props传递给这个函数

const Component = inject("store")(observer(({store, props}) => {
   return (
       <div>
          {_someRenderFunction(store, props)}
      </div>
   );
}));

它在像这样的函数中使用

function _someRenderFunction(store, props) {
   let data = store.data;
   const { cookies } = props;
   ...
}

但我收到错误Cannot read property 'cookies' of undefined

如何将商店和组件道具传递给_someRenderFunction

1 个答案:

答案 0 :(得分:2)

问题在于这一行:

({store, props}) => {};

您的组件只接收道具,因此基本定义为:

(props) => {}

Inject会在给定的道具中为您提供注入的商店。所以你收到的是:

const props = { store: STORE_INSTANCE }

使用对象破坏,您可以从props中提取属性。所以这也有效:

({ store }) => {}

在这里,您要从道具中提取属性存储。但在你的例子中,你也从道具中提取属性道具。所以在你的情况下,道具应该是:

const props = { store: STORE_INSTANCE, props: PROPS_OBJECT }

这不是你想要的。因此在这种情况下,对象破坏不是你想要的。以下代码应该有效:

const Component = inject("store")(observer((props) => {
   return (
       <div>
          {_someRenderFunction(props)}
      </div>
   );
}));

function _someRenderFunction(props) {
   const { cookies, store } = props;
   let data = store.data;
   ...
}