2017-03-02 25 views
-1

我有我的应用程序做出反应,当我尝试添加的反应响应,装饰库我收到以下错误的问题:this.props.media不是函数

遗漏的类型错误:此.props.media不是功能

import React, { PropTypes, Component } from 'react'; 
import Responsive from 'react-responsive-decorator'; 
import classnames from 'classnames'; 
import Header from '../Includes/header'; 

// Import stylesheets 
import '../../css/global.css'; 
import '../../css/parallax.css'; 
import '../../css/home.css'; 

class App extends Component { 

    state = { 
     isMobile: false 
    } 

    componentDidMount() { 
    this.props.media({ minWidth: 768 },() => { 
     this.setState({ 
      isMobile: false 
     }); 
    }); 

     this.props.media({ maxWidth: 768 },() => { 
     this.setState({ 
      isMobile: true 
     }); 
    }); 
    } 

    render() { 
    const { isMobile } = this.state; 
    const { className, ...props } = this.props; 
    return (
     <div className={classnames('App', className)} {...props}> 
     <div> 
     {isMobile ? 
      <div>Mobile</div> : 
      <div>Not mobile</div> 
     } 
     </div> 
     </div> 
    ); 
    } 
} 

export default App; 

任何帮助将是伟大的,在此先感谢!

+1

错误非常明显。 'Media'不是一个功能。调试它并查看它是什么类型。 –

+0

我已按照文档中的说明进行操作 - https://www.npmjs.com/package/react-responsive-decorator。 – AngryFridges

回答

3

您需要用@Responsive注释修饰组件以便能够使用this.props.media

@Responsive 
class App extends Component { 
    // Your code here 
}