Implementing javascript / json objects in ReactJS

Question

I want to create some kind of temporary "database" for my test project.

What is the best solution to store those objects inside React app and how to access it in different components?

To clear what I mean, I've got a search bar, after enter is pressed the function would go through the "database" and if database.title is equal to user input a new div would be rendered with object details after a button is clicked.

I would be grateful for pointing me in the right direction.

bennygenel · Accepted Answer · 2017-09-06 10:01:48Z

1

You can create a dummy data file containing an array or some sort of data in it and then import it in which component you want to test.

Example:

// dummyData.js
const dummyData = [
    {
       title: 'this is a title',
       type: 'book'
    },
    {
       title: 'this is another title',
       type: 'movie'
    },
    {
       title: 'this is a foo',
       type: 'bar'
    }
];
export default dummyData;

// on your component
import dummyData from '/path/to/your/dummyData.js';

answered Sep 6, 2017 at 10:01

bennygenel

24.8k7 gold badges68 silver badges80 bronze badges

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

3 Comments

BigPaws Over a year ago

So my next step after importing it should be something like: After clicking enter key function would iterate through the database with for(var i=0; i < database.length; i++){ if({database.name} === {this.state.term}) //term being the search term and if it finds a match I would render a new div with the database item Am I correct?

bennygenel Over a year ago

Yes. You can use some library like lodash or underscore for complicated iterations. Of course this solution is for only development and testing purposes.

BigPaws Over a year ago

Okay, thank you, I will play with this idea for a while

Collectives™ on Stack Overflow

Implementing javascript / json objects in ReactJS

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related