将MobX状态树存储注入到React组件引发错误

时间:2018-11-08 21:58:12

标签: reactjs create-react-app mobx-react mobx-state-tree

问题:尝试将MST存储注入反应类组件时出现错误:

Error: Uncaught [Error: MobX injector: Store 'auth' is not available! Make sure it is provided by some Provider

该错误源自下面发布的LoginForm组件,并且嵌套在另一个组件下(不确定是否是问题所在,因为每个组件都需要一个<Provider>?)

组件层次结构:

Application (contains no Provider)
    |__ Authentication (contains no Provider)
        |__LoginForm

一些代码:

import { AuthenticationStore } from './stores/AuthenticationStore'

const auth = AuthenticationStore.create()

ReactDOM.render(
  <Provider auth={auth}>
    <Application />
  </Provider>,
  document.getElementById('root')
);


//Application
const Application = inject('auth')(observer(class Application extends 
Component {
  render() {
    console.log(this.props.auth) // logs the store as expected
    return (
      <div className={styles.applicationContainer}>
        <Authentication/>
      </div>
    )
  }
}))

export default Application

// LoginForm
const LoginForm = inject('auth')(observer(class LoginForm extends Component {
  render() {
    return (
       <div></div>
    )
  }
}))

export default LoginForm

和问题:

如果不是这样,将商店传递给子组件(不传递为道具)的首选协议是什么?

一如既往,在此先感谢您提供的所有信息。如果这是重复项(我找不到此特定错误),请标记为类似内容,然后我将进行相应更新...

0 个答案:

没有答案