goatslacker / alt

Isomorphic flux implementation
http://alt.js.org/
3.45k stars 323 forks source link

Datasource Issue related to ##556 #623

Closed JannesV closed 8 years ago

JannesV commented 8 years ago

I'm having trouble with the error Uncaught (in promise) Error: Invariant Violation: Dispatch.dispatch(...): Cannot dispatch in the middle of a dispatch.(…)

I have tried everything I found on the web.

Source:

import Firebase from 'firebase';
import StudentsActions from '../actions/StudentsActions';
import _ from 'lodash';

let firebaseRef = new Firebase('https://radiant-heat-2605.firebaseio.com/students');

let StudentsSource = {
  getStudents: {
    remote(state, students){
      return new Promise((resolve) => {
        console.log(students, 'students');
        console.log(state, 'state');
        resolve();
        if(!students) {

        }
        students = _(students).keys().value();
        let returnStudents = {};
        students.map((student, index) => {
          firebaseRef.child(student).once('value', (dataSnapshot)=> {
            returnStudents[dataSnapshot.key()] = dataSnapshot.val();
          }).then(() => {
            //If the loop ended, resolve this promise.
            if (index === students.length - 1) {
              resolve(returnStudents);
            }
          });
        });

      });

    },
    success: StudentsActions.studentsReceived,
    error: StudentsActions.studentsFailed,
    loading: StudentsActions.studentsLoading
  }
}

export default StudentsSource;

Store:

import alt from 'components/Dispatcher';
import StudentsActions from '../actions/StudentsActions';
import {createStore, bind, datasource} from 'alt-utils/lib/decorators';
import StudentsSource from '../sources/StudentsSource';
import _ from 'lodash';

@createStore(alt)
@datasource(StudentsSource)
class StudentsStore {
  constructor() {
    students: null
  }

  @bind(StudentsActions.studentsReceived)
  receivedStudents(students) {
    let selectedStudent;
    _(students)
      .keys()
      .each((key, index) => {
        if (index === 0) {
          students[key].selected = true;
          selectedStudent = students[key];
        }
        students[key].key = key;
      })
      .value();

      console.log('students loaded');
    this.setState({
      students,
      selectedStudent,
      studentsLoading: false
    });
  }

  @bind(StudentsActions.studentChanged)
  studentChanged(selectedStudent) {
    this.setState({
      selectedStudent
    });
  }

  @bind (StudentsActions.studentsLoading)
  studentsLoading() {
    console.log('LOADING');
    this.setState({
      studentsLoading: true
    });
  }

  @bind(StudentsActions.getStudents)
  getStudents() {
    console.log(this.getInstance());
  }
}

export default alt.createStore(StudentsStore);

I started with calling the getStudents from the store directly but tried the approach via an action because that was suggested alot. But this error happens ever sinceI added the loading attribute. And I really need it. You can find the complete code on my github: https://github.com/JannesV/devinestagram