CODEWITHSUNDEEP
reactjsflux
user1038662
user1038662

Reputation: 69

Should component in React be aware of the structure of the data object get from the Store

Hi I am quite new to React and Flux, they work charmingly and really ease my work, but now I have this question bothered me for quite a while, say I have a list of file names that can turned grey in the state of unavailable.

I have done this by read the 'available' attribute inside child component:

{fileA : { available : true }, fileB : { available : false } } //data get from the Store

But Im quite uncomfortable with this as it makes my component assumes the data type in return ( that is should have a value which is a object type which shoud have an 'available' field)

Is there any other ways to achieve this in a more decoupled way or am I just making needlessly worry?

Upvotes: 0

Views: 49

Answers (2)

gor181
gor181

Reputation: 2068

We always use PropTypes to denote what we expect and avoid errors. Also PropTypes are cool as you do not need to check the whole tree of data once you revisit code after a while.

React PropTypes

Upvotes: 0

const314
const314

Reputation: 1630

In my opinion, expecting some type and property is not a big problem if you are processing the data absence correctly. As for decoupling, you can create a component for displaying single file name that awaits two props: fileName and avalable, and let the parent component pass these props to its children, for example:

var FileList = React.createClass({
    render: function(){
    return (
        this.state.files.map(function(file){
                return <FileListItem fileName={file.name} available={file.available}/>
            }, this);
        );
    }
});

In this case child component will not know any detail about your objects.

Upvotes: 1

Related Questions