Using foreach to select the correct index in an array

Question

I have been having trouble with this problem for a bit now. I use forEach to loop through an array, and I want the correct page to render with the corresponding index when I click on the component. Right now my issue is that I loop through my array, but I am not able to return the correct index, only the first one in the array. I want the startPage prop on the Pages component to render to correct index from my newNum variable.

const itemId = this.props.navigation.getParam('pk');

let newArray = this.props.moment.filter(item => {
  return item.trip == itemId
});
console.log('getting moment fromt trip')
let num = Object.keys(this.props.trip[0].moments)
let newNum = num.forEach((number, index) => {
  console.log(number)
  return number
})

return (
  // <View style={{flex:1, backgroundColor: '#F0F5F7'}} {...this.panResponder.panHandlers}>
  <View style={{flex:1, backgroundColor: '#F0F5F7'}}>
  <HeaderMomentComponent navigation={this.props.navigation} />
  <Pages indicatorColor="salmon" startPage={newNum}>
    {newArray.map((item, index) => {
      console.log('this is the index')
      console.log(index)
      return(
        <MomentContent
          name={item.name}
          place={item.place}
          description={item.description}
          tags={item.tags}
          key={index}
        />
      )
    })}
  </Pages>
</View>
);

forEach doesn't return anything. Are you looking for map? — Andrew Li
– Andrew Li, Commented Jul 28, 2018 at 17:36
It's difficult to help you without seeing more context. Where is newArray coming from? — Tholle
– Tholle, Commented Jul 28, 2018 at 17:37
Sorry, just updated it. And @Li357, I already tried map. I don't believe it will work for this use case. — Christian Lessard
– Christian Lessard, Commented Jul 28, 2018 at 17:40
@ChristianLessard It doesn't do anything even if you were to add map because you're just returning the element. You would be getting the exact same array. What's the goal with newNum? — Andrew Li
– Andrew Li, Commented Jul 28, 2018 at 17:41
newNum is supposed to be the current index when I navigate to the MomentContent component. StartPage is the prop that says what index it should start on. Currently the index it is starting on is only the first. I want the index to correspond to the correct MomentContent component that I click on. For instance, if there are two components rendered through MomentContent, one being A and one being B, If i click on B it shows me A. — Christian Lessard
– Christian Lessard, Commented Jul 28, 2018 at 17:45

dance2die · Accepted Answer · 2018-07-29 00:51:31Z

1

According to MDN documentation (Mozilla Developer Network), return value of forEach is undefined.

Use Array#map to return a newNum value.

let newNum = num.map((number, index) => {
  // Some logic to get a new number...
  return number
})

answered Jul 29, 2018 at 0:51

dance2die

37.2k39 gold badges137 silver badges200 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using foreach to select the correct index in an array

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related