2016-04-26 6 views
1

を登録していない私が取得しています:私のコンポーネントでReactJSストア

Error: Error: Store UserStore was not registered.(…) 

を:

import React from 'react'; 
import JobList from './JobList'; 
import RightPanel from './RightPanel'; 

import JobStore from '../../stores/JobStore'; 
import LoadJobsScreen from '../../actions/jobs-screen/LoadJobsScreen'; 
import UserStore from '../../stores/UserStore'; 
import LoadUsers from '../../actions/global/LoadUsers'; 
import Modal from 'react-modal'; 

export default class JobScreen extends React.Component { 

    static contextTypes = { 
     executeAction: React.PropTypes.func.isRequired, 
     getStore: React.PropTypes.func.isRequired 
    }; 

    componentWillMount() { 
     this.displayName = 'JobScreen' 
     this.state = { 
      traderModalOpened: false, 
      OFTModalOpened: false, 
      users: this.context.getStore(UserStore).getUsers(), 
     } 
     this.context.getStore(UserStore).on('change',() => { 
      this.setState({ 
       users: this.context.getStore(UserStore).getUsers() 
      }); 
     }); 
     this.context.executeAction(LoadJobsScreen, this); 
    } 

    toggleTraderModal() { 
     this.setState({ 
      traderModalOpened: !this.state.traderModalOpened 
     }); 
     console.log(this.state.traderModalOpened); 
    } 

    toggleOFTModal() { 
     this.setState({ 
      OFTModalOpened: !this.state.OFTModalOpened 
     }); 
     console.log(this.state.OFTModalOpened); 
    } 



    render() { 
     var users = []; 
     this.state.users.forEach((user) => { 
      users.push(
       <option>{user.id}</option> 
      ); 
     }); 
return (... 
     ); 
    } 
} 

懸念ストアを:

import { EventEmitter } from 'events'; 

class UserStore extends EventEmitter { 

    constructor() { 
     super(); 
     this.users = new Map(); 
    } 

    handleJobsData(payload) { 
     payload.data.jobs.forEach((user) => { 
      this.users.set(user.id, user); 
     }); 
     this.emit('change'); 

    } 

    getUsers() { 
     return this.users; 
    } 

} 

UserStore.dispatchToken = null; 

UserStore.handlers = { 
    'RECEIVED_USERS_DATA': 'handleUsersData' 
}; 

UserStore.storeName = 'UserStore'; 

export default UserStore; 

私が間違って何をしているのですか?

+0

どのFluxフレームワークを使用していますか? FacebookやFluxible?トップレベルのAppコンポーネントがレンダリングされる場所にコードを貼り付けることはできますか?ストアを使用するには、そのストアをディスパッチャーに登録する必要があります。おそらくその部分が欠けているでしょうか? – djskinner

答えて

3

私はapp.jsに自分の店舗を登録していませんでしたが、今はすべて機能しています。