In my Vue component, I have a conditional loop that iterates through train stations with 'New York' as the destination or on the route.
<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>
My table using the loop currently displays trains heading to 'New York'. However, there are also trains going in another direction but passing through 'New York'. So, I need to account for those trains as well. Here's my computed function filterTrainStations:
filterTrainStations: function() {
// Desired city for the train to reach.
const city = this.city.mediumName; // New York
return this.response.payload.departures.filter(function(u) {
// Return trains headed to the specified city.
if(u.direction === city) {
return u;
}
// Check for trains passing through the desired city.
u.routeStations.forEach(function (arrayItem) {
if(arrayItem.mediumName === city) {
console.log(u);
return u;
}
})
}
)},
The value returned from the forEach function isn't being captured, even though it shows the correct information when logged.
My question is:
Why doesn't the value of
uget returned?
The API response containing the departure information looks like this:
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": {}
}