Request-promise API 调用未按预期在 React 应用程序中更新变量

Question

我在 React 应用程序中有以下 IIFE：

const GetFeedData = (function () {
    let feed, feedId;
    return {
        getFeedId: function (sub) {
            switch (sub) {
                case '1': case '2': case '3': case '4': case '5': case '6': case 'S':
                    feedId = 1;
                    break;
                case 'A': case 'C': case 'E':
                    feedId = 26;
                    break;
                case 'N': case 'Q': case 'R': case 'W':
                    feedId = 16;
                    break;
                case 'B': case 'D': case 'F': case 'M':
                    feedId = 21;
                    break;
                case 'L':
                    feedId = 2;
                    break;
                case 'G':
                    feedId = 31;
                    break;
            }
        },
        getFeedData: function () {
            rp({
                method: 'GET',
                url: 'https://cors-anywhere.herokuapp.com/http://datamine.mta.info/mta_esi.php?key=MY_KEY&feed_id=' + feedId,
                encoding: null
            }).then((buf) => {
                feed = GtfsRealtimeBindings.transit_realtime.FeedMessage.decode(buf);
            });
        },
        get feed() { return feed; }
    };
})();

如您所见，getFeedData 应该正在更新 feed 变量，稍后将在 GetFeedData 上将其称为属性。现在，当稍后在我的代码中调用该变量时，它会显示为 undefined 并导致脚本的其余部分失败。

我在下面的代码中替换了 getFeedData 来测试这是否会影响结果：

getFeedData: function () {
        if (feedId === 2) {
            feed = require('./MockData');
        }

当我将 'L' 作为 sub 参数传入时，将 getFeedData 中的条件获取到 return true（使用我的一个组件中的下拉菜单），我不再收到 TypeError 说 feed 未定义。我假设这意味着我的问题出在 API 调用中？谁能告诉我这听起来是否正确以及我可以采取什么措施来解决这个问题？

Answer 1

您不能直接引用由异步函数设置其值的变量，因为您将运行导致值 return 编辑 undefined 的不一致。

但是，您可以通过 Promise:

直接从 getFeedData 方法 return 变量 feed

const GetFeedData = (function() {

    // more code here...

    return {
        GetFeedData: () => {
            return new Promise((resolve, reject) => {
                rp({
                    method: 'GET',
                    url: 'https://cors-anywhere.herokuapp.com/http://datamine.mta.info/mta_esi.php?key=MY_KEY&feed_id=' + feedId,
                    encoding: null
                }).then((buf) => {
                    feed = GtfsRealtimeBindings.transit_realtime.FeedMessage.decode(buf);
                    resolve(feed)
                }).catch(_ => reject())
            })
        },
    }
})()

// Use it like this
GetFeedData.GetFeedData().then((feed) => {
    console.log(feed)
})

Request-promise API 调用未按预期在 React 应用程序中更新变量

Request-promise API call not updating variable as expected in React app

javascript

request-promise