反应回流 createStore $ajax 触发器不工作

React reflux createStore $ajax trigger doesnt working

您好,我正在尝试使用触发器更新数据,但它不起作用我是 React 和 Reflux 方面的新手,我的部分代码是:

import Reflux from 'reflux'
import $ from 'jquery'
import PeopleActions from  '../actions/PeopleActions.js'

let PeopleStore = Reflux.createStore({
    listenables: [PeopleActions],
    fetchPeople: function (){
        $.ajax({
            url: 'https://randomuser.me/api',
            dataType: 'json'
        })
        .done(function(peoples){
            let people = peoples.results
            this.trigger(people)
        })
    }
})

module.exports = PeopleStore

给我下一个错误:

PeopleStore.js?13fb:14 Uncaught TypeError: this.trigger is not a function
    at Object.eval (eval at <anonymous> (app.js:2617), <anonymous>:27:9)
    at fire (eval at <anonymous> (app.js:2623), <anonymous>:3317:31)
    at Object.fireWith [as resolveWith] (eval at <anonymous> (app.js:2623), <anonymous>:3447:7)
    at done (eval at <anonymous> (app.js:2623), <anonymous>:9272:14)
    at XMLHttpRequest.eval (eval at <anonymous> (app.js:2623), <anonymous>:9514:9)

您所拥有的是 Store 概念和 Actions 概念的奇怪组合。这是通量流动的两个相关但不同的方面。我会建议找到反流指南并密切注意这些概念之间的区别。

具体来说,您的函数 fetchPeople 是一个动作,而不是处理程序。商店希望有一个名为 onFetchPeople 的不同方法,其定义与您所写的完全不同。

鉴于 "trigger" 函数的概念仅存在于操作中,而不存在于存储中,因此您的错误完全是预料之中的。但除此之外,尝试从自身内部触发一个动作没有多大意义。

您使用的是 Reflux 的旧方法。它应该是这样的:

export default class PeopleStore extend Reflux.Store {
    constructor() {
        super();
        this.listenables = PeopleActions;
    }

    fetchPeople() {
        $.ajax({
            url: 'https://randomuser.me/api',
            dataType: 'json'
        })
        .done((peoples) => {
            let people = peoples.results
            this.setState(people)
        })
}

触发 PeopleActions.fetchPeople(),任何监听 PeopleActions 的商店都会从商店内触发 fetchPeopleonFetchPeople,具体取决于存在的功能。