[React] [Flussmittel] [EventEmitter] diese Referenz ändert sich in der Komponente zu speichern Ref

Question

Ich habe eine Komponente, eine Aktion und ein Geschäft, mit React & Flux.

Wenn ich ein Ereignis aus dem Store an eine Methode in meiner Komponente absende, ändert sich "this" ref in meiner Komponente zu "Store" ref.

Haben Sie eine Ahnung, warum das passiert?

Der Laden entsendet hier Veranstaltung, in der getAllVotes() -Methode: https://huit.re/voteStoreRow41

import { EventEmitter } from 'events'; 

import dispatcher from '../dispatcher/dispatcher.jsx'; 
import request from 'superagent'; 
import nocache from 'superagent-no-cache'; 

const BASE_URL = "http://odu.priv/ws"; 

class VoteStore extends EventEmitter { 
    constructor(){ 
     super() 
     this.votes = []; 
     this.voteComponent = {}; 

     dispatcher.register(this.handleActions.bind(this)); 
    } 

    getAll(){ 
     return this.votes; 
    } 

    setVotes(listVote){ 
     this.votes.push(listVote); 
     this.emit('change'); 
    } 

    getAllVotes(){ 
     this.emit('change'); 
    } 

Und die Komponente dieses Ereignis hier ist der Umgang: https://huit.re/votesL33 wo "diese" Änderungen an voteStore Ref in der updateVote() -Methode .

import React from 'react'; 

import { Vote } from '../vote/vote.jsx'; 
import voteStore from '../../stores/voteStore.jsx'; 

import { getAllVote } from '../../actions/voteActions.jsx'; 

class Votes extends React.Component { 
    constructor(props) { 
    super(props); 
    console.log('const -> ', voteStore); 
    this.state = { 
     votes : voteStore.getAll() 
    }; 
    } 

    componentWillMount() { 
    voteStore.on('change', this.updateVote); 
    getAllVote(); 
    console.log("Votes ", this.state.votes); 
    } 

    /*componentWillUnmount() { 
    voteStore.removeListener('change',this.updateVote); 
    }*/ 

    updateVote(){ 
    console.log('this -> ',this); 
    console.log('voteStore -> ',voteStore) 
    this.setState({ 
     votes : voteStore.getAll() 
    }); 
    console.log('this.state',this.voteComponent.votes); 
    } 

Was ich nur nicht verstehe, ist, warum meine „das“ ref, wenn nicht die „Stimmen“ Instanz mehr, sobald die „getAllVotes()“ Methode im Laden aufgerufen wird. Dies bewirkt, dass "this.state" in der unteren Zeile nicht definiert ist.

Vielen Dank im Voraus.

Answer 1

Das Problem kommen aus Ihrer Klasse Abstimmen, wenn Sie den EventListener hinzufügen Sie this.updateVote aufrufen, sollten Sie diese Funktion this.updateVote.bind(this) aufrufen, wie Sie eine Funktion von Ihrem virtuellen DOM aufrufen.