【问题标题】:React Native + Flux, unresponsive dispatcherReact Native + Flux,无响应的调度程序
【发布时间】:2017-02-10 16:23:22
【问题描述】:

我正在构建我的第一个 react-native 应用程序。我习惯于使用 Flux MVC 模式构建 React 应用程序。我已经(正确地)将 Flux 集成到我的 React Native 项目中,但是调度程序上的 register 函数似乎完全没有响应。

Actions.js

import AppConstants from '../constants';
import AppDispatcher from '../dispatcher';

export default {
    setUser (user) {
        AppDispatcher.dispatch({
            actionType: AppConstants.SET_USER,
            user: user
        })
    }
}

Store.js

import AppDispatcher from '../dispatcher';
import AppConstants from '../constants';
import assign from 'object-assign';
import { EventEmitter } from 'events';

const CHANGE_EVENT = 'change';

const AppStore = assign({}, EventEmitter.prototype, {

    emitChange () {
        this.emit(CHANGE_EVENT);
    },

    addChangeListener (callback) {
        this.on(CHANGE_EVENT, callback);
    },

    removeChangeListener (callback) {
        this.removeListener(CHANGE_EVENT, callback);
    },

    dispatcherIndex: register(function (action) {
        console.log(action); // <-- No response
    })

});

export default AppStore;

Dispatcher.js

import { Dispatcher } from 'flux';
module.exports = new Dispatcher();

我什至尝试重写 Dispatcher.js 文件,以便对 dispatchregister 函数进行硬编码。我收到了来自dispatch() 的回复,但从未收到来自register() 的回复。

Dispatcher2.js

import { Dispatcher } from 'flux';

const flux = new Dispatcher();

export function register (callback) {
    console.log('event!');
    return flux.register(callback);
}

export function dispatch (action) {
    console.log(action);
    flux.dispatch(action);
}

【问题讨论】:

    标签: javascript reactjs react-native flux reactjs-flux


    【解决方案1】:

    浏览本文档。我不知道你的代码,但这样我们也可以使用通量。 http://fluxxor.com/ 。这是非常简单且易于使用的。如果这对您的问题有帮助,请接受答案。

    【讨论】:

      【解决方案2】:

      您从哪里获得商店的代码?无论如何,当您的其余属性是纯函数时,是否有理由将 dispatchIndex 作为方法调用?

      冒着给你代码没有帮助的风险,这是我学会如何根据香草助焊剂的反应助焊剂文档使用商店的方法:

      import Immutable from 'immutable'
      import {ReduceStore} from 'flux/utils'
      import myActionTypes from './../data/myThing/myActionTypes'
      import dispatcher from '../data/dispatcher'
      import AppConstant from '../data/myThing/AppConstant'
      
      class myStore extends ReduceStore{
          constructor(){
              super(dispatcher);
          }
      getInitialState(){
      return Immutable.OrderedMap({});
      }
      reduce(state,action){
          switch(action.actionType){
              case AppConstant.SET_USER:
                  return state.set({//data you want to set})
              case AppConstant.OTHER_THING:
                  //additional logic
      

      希望这是有用的,而不仅仅是我告诉你为了一些不相关的事情放弃你的代码。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2015-09-06
        • 2016-01-29
        • 2016-12-03
        • 1970-01-01
        • 2016-06-29
        • 1970-01-01
        • 2018-06-08
        • 2015-06-29
        相关资源
        最近更新 更多