Javascript 不会返回来自for each循环的值

我的Vue组件中有一个条件for循环。我只想在以“纽约”为目的地或“纽约”在路线上的火车站循环

<tr v-for="departure in filterTrainStations" :key="departure.name">
            <td>{{ departure.product.categoryCode }}</td>
            <td>{{ departure.direction }}</td>
            <td>{{ getTimeFromDate(departure.actualDateTime) }}</td>
            <td>{{ departure.name }} </td>
        </tr>

应该从forEach函数返回的值不会返回任何内容，但当i console.log时，它会向我显示正确的信息

我的问题是:

为什么值u没有返回

我从API中检索出发信息的响应如下所示：

response: {
          "links": {},
            "payload": {
                "source": "PPV",
                "departures": [
                    {
                        "direction": "Weert",
                        "name": "NS  5249",
                        "plannedDateTime": "2019-10-10T15:08:00+0200",
                        "plannedTimeZoneOffset": 120,
                        "actualDateTime": "2019-10-10T15:08:00+0200",
                        "actualTimeZoneOffset": 120,
                        "plannedTrack": "1",
                        "product": {
                            "number": "5249",
                            "categoryCode": "SPR",
                            "shortCategoryName": "NS Sprinter",
                            "longCategoryName": "Sprinter",
                            "operatorCode": "NS",
                            "operatorName": "NS",
                            "type": "TRAIN"
                        },
                        "trainCategory": "SPR",
                        "cancelled": false,
                        "routeStations": [
                            {
                                "uicCode": "8400129",
                                "mediumName": "Boxtel"
                            },
                            {
                                "uicCode": "8400206",
                                "mediumName": "Eindhoven"
                            },
                            {
                                "uicCode": "8400245",
                                "mediumName": "Geldrop"
                            }
                        ],
                        "departureStatus": "INCOMING"
                    },
                ]
            },
            "meta": {}
          }

为什么值u没有返回

因为return语句只是从传递给forEach的函数中返回，所以它不会从外部filter方法返回。您应该改为使用“查找并返回结果”：

filterTrainStations: function() {

    // Direction where the train has to go to.
    const city = this.city.mediumName; // New York

    return this.response.payload.departures.filter(function(u) {
        // Only return the trains which go to the right direction. 
        if(u.direction === city) {
            return u;
        }   

        // Check if there are any trains with the desired city on their route.
        return u.routeStations.find(arrayItem => arrayItem.mediumName === city);
    }
)},

但这又引发了另一个问题——代码行本身就在一个过滤器中，根据您是否希望结果中包含该项，您应该在过滤器中返回true或false。如果没有更多的信息，就很难协调你所遇到的实际问题。但是，返回任何真实的内容都会导致结果中包含该离开项

---

就我个人而言，我会按照建议去做，因为这更清楚。

您的过滤器回调不适合您想要实现的目标。 试试下面这个：

filterTrainStations: function() {

    // Direction where the train has to go to.
    const city = this.city.mediumName; // New York

    return this.response.payload.departures.filter(function(u) {
        return u.direction == city || u.routeStations.some(function(rs){ rs.mediumName == city});
    });
)}

如果有帮助，请告诉我

---

编辑：也对代码进行了编辑，以便您更容易了解如何使用它

这是因为它将返回内部的forEach闭包，而不是外部的过滤器。看起来使用会是一个更好的选择。目前还不清楚forEach打算做什么。它在一个过滤器里，这是一个奇怪的地方有它。过滤器是否要检查两个条件，然后返回u？在这种情况下可能更合适。你可能是对的，但是通过返回任何truthy，筛选器将工作，并且只要在你的情况下返回true，或者在我的情况下查找返回非null，筛选器可能会按照他们的预期工作。是的，你的答案也是可靠的，我唯一要更改的是格式，因此，您只需返回一次，而不是OPs原始代码格式谢谢，我在设计时将代码保持在OP附近，但我自己不会这样做。我已经指出了你的答案，IMO是正确的答案。函数现在只返回true或false，但不返回数据。我相信你的答案是正确的，因为它比我自己制作的函数要清楚得多，但是我如何返回数据，而不是只返回真或假？或者我必须修改表中的v-for吗@MKougiourisI做了一次编辑，以便更好地理解语句的位置，如果你照原样去做的话，它应该会起作用！从过滤器内部返回值确实是不对的。我只想在方向匹配城市或城市位于routeStations数组中时返回所有内容。@Baspa看到另一个答案了吗。这是实现你的目标更好的方法。

filterTrainStations: function() {

    // Direction where the train has to go to.
    const city = this.city.mediumName; // New York

    return this.response.payload.departures.filter(function(u) {
        return u.direction == city || u.routeStations.some(function(rs){ rs.mediumName == city});
    });
)}