Mobx Reactjs不适合我(我无法注入我的商店)

时间:2017-06-24 00:08:20

标签: javascript reactjs mobx mobx-react

我不确定我做错了什么,但我一直都有错误。我想一次会做一个错误。我把我的项目剥夺了光秃秃的骨头。希望有人能看到问题

app.bundle.js?31044e2…:12841 Uncaught TypeError: Cannot read property 'isMobxInjector' of undefined
    at observer (app.bundle.js?31044e2…:12841)
    at Object.<anonymous> (app.bundle.js?31044e2…:35924)
    at __webpack_require__ (app.bundle.js?31044e2…:20)
    at Object.<anonymous> (app.bundle.js?31044e2…:23127)
    at __webpack_require__ (app.bundle.js?31044e2…:20)
    at Object.<anonymous> (app.bundle.js?31044e2…:17566)
    at __webpack_require__ (app.bundle.js?31044e2…:20)
    at module.exports (app.bundle.js?31044e2…:63)
    at app.bundle.js?31044e2…:66

app.js

import React from 'react';
import ReactDOM from 'react-dom';
import stores from './stores';
import UserPage from './components/UserPage'
import { Provider  } from 'mobx-react';

ReactDOM.render(
    <Provider userStore={stores.userStore}>
        <UserPage  />
    </Provider>,      
       document.getElementById('root')
);

UserPage

    import React, { Component } from 'react'
    import ReactDOM from 'react-dom';
    import { observer, inject } from 'mobx-react';
    import DevTools from 'mobx-react-devtools';

    import Asset from '../classes/user'


@inject('userStore')
@observer()
export default class UserPage extends Component {
    constructor() {
        super();
    }
    render() {
        let userStore = this.props.userStore;


        return (
            <div>
                test
            </div>
        )
    }
}

UserStore

import {observable, computed, action} from 'mobx';


class UserStore {
    @observable users = []
    @observable activeUser = 2;
    @computed get count() {
        return this.users.length;
    }
    @action.bound setActiveUser(){
        // I would like to pass in a paramter but not sure if it is possible with @action.bound
        this.activeUser = 1;
    }
}

var userStore = new UserStore();

export default userStore;

index.js

import userStore from './userStore';

const stores = {
    userStore
}

export default stores;

用户

import {observable} from 'mobx';

class User {
    @observable firstName
    @observable lastName

    constructor(firstName = '', asselastNametType = '') {
        this.firstName = firstName;
        this.lastName = asselastNametType;
    }
}

export default User;

1 个答案:

答案 0 :(得分:2)

observer不接受任何争论。改为改为:

@inject('userStore')
@observer
export default class UserPage extends Component {
  render() {
    let userStore = this.props.userStore;
    return <div> test </div>
  }
}