它必须是一个函数,通常来自React.PropTypes

Question

我想将字符串从Main传递给Header.它成功但警告.我是React的初学者,所以我无法弄清楚是什么it must be a function意思.

谁知道如何解决这个警告？

警告是:

我的代码如下:

Main.js

import React from 'react';

import Header from './Header';
import AppList from './AppList/AppList';
import Footer from './Footer';

const propTypes = {
  mainInfo: React.PropTypes.shape({
    title: React.PropTypes.string.isRequired,
    apps: React.PropTypes.array.isRequired,
  }),
};

class Main extends React.Component {
  static methodsAreOk() {
    return true;
  }

  render() {
    return (
      <div>
        <Header title={this.props.mainInfo.title} />
        <AppList apps={this.props.mainInfo.apps} />
        <Footer />
      </div>
    );
  }
}

Main.propTypes = propTypes;

export default Main;

Header.js

import React from 'react';

const propTypes = {
  title: React.PropTypes.string.isRequred,
};

class Header extends React.Component {
  static methodsAreOk() {
    return true;
  }

  render() {
    return (
      <div className="header">
        <h1>{this.props.title}</h1>
      </div>
    );
  }
}

Header.propTypes = propTypes;

export default Header;

Answer 1

你有一个错误:React.PropTypes.string.isRequred.拼写isRequired正确,应该没问题.

Answer 2

当你的PropType实际上是这种情况undefined.

在我的情况下,我指定了propType PropTypes.integer,它不是proptypes列表之一.字面上变成了undefined.相反,我应该使用PropTypes.number.

Answer 3

另外，它是bool针对布尔值的。我浏览了一下文档，并遇到了完全相同的问题，直到我回去仔细阅读它们为止。

https://facebook.github.io/react/docs/typechecking-with-proptypes.html