使用原型

Question

class ContentLoader extends Component {

state = {
    animation: new Animated.Value(0)
}


render() {
    if (this.props.loading) {
        return (<View
            style={{
                height: 100,
                width: 100
            }}
        />);
    }
    return this.props.children;

}
}


ContentLoader.prototype = {
    primaryColor: PropTypes.string,
    secondaryColor: PropTypes.string,
    animationDuration: PropTypes.number,
    // children: PropTypes.element.isRequired,
    style: PropTypes.object.isRequired,
    loading: PropTypes.bool,

}
ContentLoader.defaultProps = {
    primaryColor: 'rgba(195, 191, 191, 1)',
    secondaryColor: 'rgba(218, 215, 215, 1)',
    animationDuration: 500,
    loading: true
};

export default ContentLoader;

当我在组件中使用它时，我得到渲染没有返回任何内容吗？ 但是当我评论这部分

 ContentLoader.prototype = {
    primaryColor: PropTypes.string,
    secondaryColor: PropTypes.string,
    animationDuration: PropTypes.number,
    // children: PropTypes.element.isRequired,
    style: PropTypes.object.isRequired,
    loading: PropTypes.bool,
}

一切正常吗？ 有什么帮助吗？ 没有道具类型，一切都会很好，或者也许我做错了。

Answer 1

ContentLoader.propTypes而不是ContentLoader.prototype

原型用于向对象添加方法，与类型检查无关。

这是一个有效的示例：https://stackblitz.com/edit/react-ww1xyk

  

https://reactjs.org/docs/typechecking-with-proptypes.html

     

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/prototype