What if I have media queries in an object?

[erwagasore]

I have all media queries in an object which I get from a property

Calling Logo

`var mQueries = {'phone': {maxWidth: 414}, 'tablet': {minWidth: 870}, 'desktop': {minWidth: 1084}};

` ## Logo.jsx ``` .... componentDidMount: function() { var mediaQueries = this.props.mediaqueries; for(i in Object.keys(mediaQueries)) { var key = Object.keys(mediaQueries)[i]; this.media(mediaQueries[key], function() { this.setState({media: key}); }.bind(this)); } } ... ``` This only shows the last item in the object. Need your help

[erwagasore]

Is there a way to check if the match happened so that I can decide which media query I can use to set the state?

[erwagasore]

I found a solution in your other lib. react-slick (https://github.com/akiran/react-slick/blob/master/lib/slider.jsx#L20-L33)

Here is how it looks in mine

    Object.keys(mediaQueries).forEach(function(key) {
      this.media(mediaQueries[key], function() {
        this.setState({media: key});
      }.bind(this));
    }.bind(this));