ReactJS商店 - this.context.getStore関数（...）

Question

ではない私が持っている：

import React from 'react'; 
import FilterButton from './FilterButton'; 
import FilterJobsScreen from '../../actions/jobs-screen/FilterJobsScreen'; 

import JobStore from '../../stores/JobStore'; 

export default class RightPanel extends React.Component { 

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

    constructor() { 
     super(); 
    } 

    componentWillMount() { 
     this.setState({ 
      counts: this.context.getStore(JobStore).getCounts() 
     }); 
     this.context.getStore(JobStore).on('change',() => { 
      this.setState({ 
       counts: this.context.getStore(JobStore).getCounts() 
      }); 
     }); 
    } 

    componentDidMount() { 
     this.load(); 
    } 

    load() { 

    } 

    onClick(e) { 
     var filters_array = this.state.filters; 
     var idx = filters_array.indexOf(e); 
     if (idx === -1) { 
      filters_array.push(e); 
     } else { 
      filters_array.splice(idx, 1); 
     } 
     this.setState({ 
      filters: filters_array 
     }) 
     this.context.executeAction(FilterJobsScreen, this); 
    } 

    render() { 
     return (
      <div> 
       <div className="controls"> 
        <span className="title">Filters</span> 
        <FilterButton onClick={this.onClick.bind(this, 'My jobs')} name='My jobs' 
            count={this.state.counts.my_jobs} active={true}/> 
        <FilterButton onClick={this.onClick.bind(this, 'Not approved')} name='Not approved' 
            count={this.state.counts.not_approved}/> 
        <FilterButton onClick={this.onClick.bind(this, 'Supply')} name='Supply' 
            count={this.state.counts.supply}/> 
        <FilterButton onClick={this.onClick.bind(this, 'Repair')} name='Repair' 
            count={this.state.counts.repair}/> 
        <FilterButton onClick={this.onClick.bind(this, 'Service exchange')} name='Service exchange' 
            count={this.state.counts.service_ex}/> 
        <FilterButton onClick={this.onClick.bind(this, 'Urgent')} name='Urgent' 
            count={this.state.counts.urgent}/> 
        <FilterButton onClick={this.onClick.bind(this, 'Today')} name='Today' 
            count={this.state.counts.today}/> 
        <FilterButton onClick={this.onClick.bind(this, 'Overdue')} name='Overdue' 
            count={this.state.counts.overdue}/> 
       </div> 
       <div className="controls"> 
        <span className="title">Sorts</span> 
       </div> 
      </div> 
     ) 
    } 
}; 

RightPanel.contextTypes = { 
    executeAction: React.PropTypes.func.isRequired 
}; 

export default RightPanel; 

しかし、私はそれは私にエラーを与えているページをロードしよう：

this.context.getStore is not a function 

しかし、私はそれを上に持ち込みます：

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

どこが間違っていますか？ここで

---

は私の店である：

import { EventEmitter } from 'events'; 

class JobStore extends EventEmitter { 

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

    handleJobsData(payload) { 
     console.log(payload) 
     if (payload.clear === true) { 
      this.jobs = new Map(); 
     } 
     payload.data.jobs.forEach((job) => { 
      this.jobs.set(job.id, job); 
     }); 
     this.counts = payload.data.counts; 

     this.emit('change'); 

    } 

    getCounts() { 
     return this.counts; 
    } 

    getJobs() { 
     return this.jobs; 
    } 

    dehydrate() { 
     return this.jobs; 
    } 

    rehydrate (state) { 

    } 

} 

JobStore.dispatchToken = null; 

JobStore.handlers = { 
    'RECEIVED_JOBS_DATA': 'handleJobsData' 
}; 

JobStore.storeName = 'JobStore'; 

export default JobStore; 

Answer 1

あなたは、コンストラクタメソッドのパラメータを通して、あなたの小道具やコンテキストを受け取るためにあなたは、あなたのコンストラクタを変更する必要があります。

constructor(props, context) { 
    super(props, context); 
} 

これはあなたをしませんプロパティとコンテキストオブジェクトが失われます。

Answer 2

私はなぜ知らないが、削除した後：

RightPanel.contextTypes = { 
    executeAction: React.PropTypes.func.isRequired 
}; 

export default RightPanel; 

をそれは動作します。

とにトップを変更：

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