Javascript _react2.default.PropTypes.function未定义

Javascript _react2.default.PropTypes.function未定义,javascript,reactjs,react-native,Javascript,Reactjs,React Native,所以我有一个按钮组件 import React, { Component } from 'react'; import { View, Text, TouchableNativeFeedback } from 'react-native'; class Button extends Component { generateComponent() { const { buttonStyle, textStyle } = this.styles; const

所以我有一个按钮组件

import React, { Component } from 'react';
import { View, Text, TouchableNativeFeedback } from 'react-native';

class Button extends Component {
    generateComponent() {
        const { buttonStyle, textStyle } = this.styles;
        const { text } = this.props;

        switch (this.props.platform) {
            case 'android':
                return (
                    <TouchableNativeFeedback onPress={this.props.onPress}>
                        <View style={buttonStyle}>
                            <Text style={textStyle}>{text}</Text>
                        </View>
                    </TouchableNativeFeedback>
                );
            case 'ios':
                return 0;
        }
    }

    render() {
        return (
            <View>
                { this.generateComponent() }
            </View>
        );
    }

    styles = {
        buttonStyle: {
            borderRadius: 100,
            justifyContent: 'center',
            height: parseInt(this.props.size, 10),
            width: parseInt(this.props.size, 10),
            backgroundColor: this.props.color,
            elevation: 3
        },
        textStyle: {
            fontWeight: 'bold',
            fontSize: parseInt(this.props.fontSize, 10),
            lineHeight: parseInt(this.props.fontSize, 10)
                + Math.floor(parseInt(this.props.fontSize, 10) / 10) + 1,
            color: this.props.fontColor,
            textAlign: 'center'
        }
    }
}

Button.propTypes = {
    text: React.PropTypes.string.isRequired,
    platform: React.PropTypes.string.isRequired,
    size: React.PropTypes.string.isRequired,
    color: React.PropTypes.string.isRequired,
    fontColor: React.PropTypes.string.isRequired,
    fontSize: React.PropTypes.string.isRequired,
    onPress: React.PropTypes.function.isRequired
};

export default Button;
import React,{Component}来自'React';
从“react native”导入{View,Text,TouchableNativeFeedback};
类按钮扩展组件{
generateComponent(){
const{buttonStyle,textStyle}=this.styles;
const{text}=this.props;
开关(本道具平台){
“安卓”案例:
返回(
{text}
);
案例“ios”:
返回0;
}
}
render(){
返回(
{this.generateComponent()}
);
}
样式={
按钮样式:{
边界半径:100,
为内容辩护:“中心”,
高度:parseInt(this.props.size,10),
宽度:parseInt(this.props.size,10),
背景颜色:this.props.color,
立面图:3
},
文本样式:{
fontWeight:'粗体',
fontSize:parseInt(this.props.fontSize,10),
线宽:parseInt(this.props.fontSize,10)
+数学地板(parseInt(this.props.fontSize,10)/10)+1,
颜色:this.props.fontColor,
textAlign:“中心”
}
}
}
Button.propTypes={
text:React.PropTypes.string.isRequired,
平台:React.PropTypes.string.isRequired,
大小:React.PropTypes.string.isRequired,
颜色:React.PropTypes.string.isRequired,
fontColor:React.PropTypes.string.isRequired,
fontSize:React.PropTypes.string.isRequired,
onPress:React.PropTypes.function.isRequired
};
导出默认按钮;
我把这个组件叫做“组件之家”

import React, { Component } from 'react';
import { View } from 'react-native';
import Metas from '../components/Metas';
import Button from '../components/Button';

export default class Home extends Component {
    constructor(props) {
        super(props);
        this.state = { metas: ['Meta 1', 'Meta 2', 'Meta 3'] };
    }

    render() {
        return (
            <View>
                <Metas data={ this.state.metas } />
                <Button
                    text="+"
                    platform={ this.props.platform }
                    onPress={ this._handleButtonPress }
                    size='50'
                    fontSize='25'
                    color='#FFD600'
                    fontColor='white'
                />
            </View>
        );
    }

    _handleButtonPress() {
        console.log("Hello!");
    }
}

Home.propTypes = {
    platform: React.PropTypes.string.isRequired
};
import React,{Component}来自'React';
从“react native”导入{View};
从“../components/Metas”导入图元;
从“../components/Button”导入按钮;
导出默认类Home extends组件{
建造师(道具){
超级(道具);
this.state={metas:['meta1','meta2','meta3']};
}
render(){
返回(
);
}
_车把钮扣压力机(){
log(“你好!”);
}
}
Home.propTypes={
平台:React.PropTypes.string.isRequired
};
问题是,如果我包括PropTypes,我会得到一个错误,说onPress prop是未定义的

我不明白为什么我会收到这个错误。我控制台记录了onPress的类型,它具有打印功能


有什么建议吗???

您输入的道具类型有误。应该是

onPress: React.PropTypes.func

请参阅本参考资料——

2017年9月更新

自React 15.5起,PropTypes已移动到其自己的库中。像这样使用它:

import PropTypes from 'prop-types';

class Example extends React.Component {
  render() {
    return (
      <h1>{this.props.test}</h1>
    );
  }
}

Example.propTypes = {
  test: PropTypes.string
};
从“道具类型”导入道具类型;
类示例扩展了React.Component{
render(){
返回(
{this.props.test}
);
}
}
示例.propTypes={
测试:PropTypes.string
};

来源:

React.PropTypes.func
?Not
function
。是的_react2.default.PropTypes.function未定义@putvande指出,语法为
React.PropTypes.func
,而不是
React.PropTypes.function
否我得到_react2.default.PropTypes.function。这不是直接的反应,是国产的反应哦,好吧,我想你是在抱怨标题,谢谢。Sry