Use variable outside of map function with react

Question

I'm having a little problem with some vars.

My code is:

import React from 'react';
import mongoose from 'mongoose';
var sch = require('../models/schema');

export default class IndexPage extends React.Component {
  render() {

    sch.find(function(err,models){
       //???
    });

    return (
      <div className="home">
        Afiez ceva {models}
      </div>
    );

  }
}

How to achieve this? I ve tried all the posibilites. I want to be able to render someting like {models} or {models[0].whatever} .. Some tip please?

Reference for sch:

import mongoose from 'mongoose';

var schValue = new mongoose.Schema({
  asd: String
});

schValue.set( 'collection', 'ecommerce' );

module.exports = mongoose.model('sch', schValue);

Welcome to the wonderful world of async! You need to use callbacks or promises. — SLaks
– SLaks, Commented Feb 20, 2017 at 23:29
You don't have to use redux. Although it is good to scale up you application. I am not sure what you are trying to do, but you need to use the state. You should make a function that uses setState() and use this.state inside your render function. Once the state updates, your component will rerender automatically : facebook.github.io/react/docs/state-and-lifecycle.html — Kevin Amiranoff
– Kevin Amiranoff, Commented Feb 20, 2017 at 23:37
Or maybe not. if you just want to render a list, you have to map over this list. and return this map inside the render function. — Kevin Amiranoff
– Kevin Amiranoff, Commented Feb 20, 2017 at 23:42

Kevin Amiranoff · Accepted Answer · 2017-02-21 00:36:29Z

1

I have not tested it but is that something like this you need :

  export default class IndexPage extends React.Component {

  constructor() {
    super();

    this.state = {
      models: [],
    };
  }

  componentWillMount() {
    sch.find({}, (err, models) => {
      this.setState({ models });
    });
  }

  render() {
    return (
      <div className="home">
        {this.state.models.map(model => {
          return model;
        })}
      </div>
    );
  }
}

edited Feb 21, 2017 at 0:36

answered Feb 20, 2017 at 23:49

Kevin Amiranoff

14.7k16 gold badges65 silver badges95 bronze badges

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

6 Comments

Adi Pîslaru Over a year ago

getModels not defined

Kevin Amiranoff Over a year ago

Sorry again. I reedited. it should be this.getModels()

Adi Pîslaru Over a year ago

TypeError: sch.map is not a function

Kevin Amiranoff Over a year ago

map works on array. Could you add to your question, what is sch ?

Kevin Amiranoff Over a year ago

I am sorry. I misunderstood your question. I dont think my answer apply to your question

|

Collectives™ on Stack Overflow

Use variable outside of map function with react

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related