Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

I'm trying to get data from an array and using map function to render content. Look at

**{this.lapsList()}** 

and the associated

**lapsList()** 

function to understand what I'm trying to do. The result is nothing is displaying (Views under view, etc.) Here is my simplified code:

class StopWatch extends Component {
constructor(props) {
  super(props);
  this.state = {
    laps: []
render() {
  return (
    <View style={styles.container}>
        <View style={styles.footer}>
          <View><Text>coucou test</Text></View>
          {this.lapsList()}
        </View>
    </View>
lapsList() {
    this.state.laps.map((data) => {
      return (
        <View><Text>{data.time}</Text></View>
_handlePressLap() {
  console.log("press lap");
  if (!this.state.isRunning) {
    this.setState({
      laps: []
    return
  let laps = this.state.laps.concat([{'time': this.state.timeElapsed}]);
  this.setState({
      laps: laps
  console.log(laps);
                I want to get index of the item too, but unable to get that. this.state.array.map((item, index) =>. The index, I am getting from that is some object with Cyclic reference, so unable to print it as well. Any way to get index value for that?
– Narendra Singh
                Jul 7, 2018 at 10:59

Try moving the lapsList function out of your class and into your render function:

render() {
  const lapsList = this.state.laps.map((data) => {
    return (
      <View><Text>{data.time}</Text></View>
  return (
    <View style={styles.container}>
      <View style={styles.footer}>
        <View><Text>coucou test</Text></View>
        {lapsList}
      </View>
    </View>
                Hey, wouldn't say it's better, just another way of structuring your code I guess. Either way will work as long as you return your component in map.
– Nader Dabit
                May 25, 2016 at 19:39
                Ok, I asked that because sometimes it takes less ressources! ;-) Btw thanks for your code!
– Xavier C.
                May 25, 2016 at 19:50
        

Thanks for contributing an answer to Stack Overflow!

  • Please be sure to answer the question. Provide details and share your research!

But avoid

  • Asking for help, clarification, or responding to other answers.
  • Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.