Javascript 反应：检查器不是一个函数

React: checker is not a function

提问by Alan Souza

I'm getting this weird warning message in the console for my React app.

我在 React 应用程序的控制台中收到了这条奇怪的警告消息。

Warning: Failed propType: checker is not a function Check the render method of Chart.

警告: 失败的 propType: checker is not a function 检查Chart.

I do not have any checker method at all. If I remove my propTypes, the warning is gone. Any ideas?

我根本没有任何检查方法。如果我删除 my propTypes，警告就会消失。有任何想法吗？

My react component:

我的反应组件：

var Chart = React.createClass({
  //...
  propTypes: {
    legend: React.PropTypes.bool,
    max: React.PropTypes.number,
    min: React.PropTypes.number,
    series: React.PropTypes.arrayOf(
      React.PropTypes.shape({
        label: React.PropTypes.string,
        values: React.PropTypes.arrayOf(
          React.PropTypes.arrayOf(
            React.PropTypes.oneOfType(
              React.PropTypes.number,
              React.PropTypes.object // Date
            )
          )
        ),
        colorIndex: React.PropTypes.string
      })
    ).isRequired,
    threshold: React.PropTypes.number,
    type: React.PropTypes.oneOf(['line', 'bar', 'area']),
    units: React.PropTypes.string,
    xAxis: React.PropTypes.arrayOf(React.PropTypes.string)
  },
  render: function() {
    return (<svg>...</svg>);
  }
  //...
});

The payload I send to the Chart component is this one:

我发送到 Chart 组件的有效负载是这样的：

var series = [
  {label: 'first', values: [[5,2], [4,3], [3,3], [2,2], [1,1]], colorIndex: "graph-1"},
  {label: 'second', values: [[5,3], [4,2], [3,0], [2,0], [1,0]], colorIndex: "graph-2"}
];

采纳答案by Alan Souza

A pull request has been merged to the React repo that provides a better feedback for the developer whenever a mistake like this happens again.

拉取请求已合并到 React 存储库中，每当类似的错误再次发生时，它都会为开发人员提供更好的反馈。

Now, the validation message will look like the following:

现在，验证消息将如下所示：

Invalid argument supplied to oneOf, expected an instance of array.

提供给 oneOf 的参数无效，需要一个数组实例。

https://github.com/facebook/react/pull/3963

https://github.com/facebook/react/pull/3963

This should be part of React 0.14.

这应该是 React 0.14 的一部分。

回答by stephanmantel

In my case I got this when I used the shape function with a complex object. The solution was to go from:

就我而言，当我对复杂对象使用 shape 函数时，我得到了这个。解决方案是从：

outerObject: shape({
  firstInnerObject: {
    a: string,
    b: string,
  },
  secondInnerObject: {
    a: string,
    b: number,
  },
}),

To:

到：

outerObject: shape({
  firstInnerObejct: shape({
    a: string,
    b: string,
  }),
  secondInnerObject: shape({
    a: string,
    b: number,
  }),
}),

Very trivial, I know, yet this might be the solution for someone equally inexperienced as I am. ;)

我知道这很微不足道，但对于和我一样缺乏经验的人来说，这可能是解决方案。;)

回答by Michelle Tilley

Change

改变

React.PropTypes.oneOfType(React.PropTypes.number, React.PropTypes.object)

to

到

React.PropTypes.oneOfType([React.PropTypes.number, React.PropTypes.object])

(the argument should be an array)

（参数应该是一个数组）

回答by MickJuice

FWIW, I was getting Failed PropType: typeChecker is not a function. I noticed that in my PropTypes.arrayOf()properties, I was passing in an object of PropTypes e.g. PropTypes.arrayOf({})instead of passing in PropTypes.shape()e.g. PropTypes.arrayOf(PropTypes.shape({})

FWIW，我得到了Failed PropType: typeChecker is not a function。我注意到在我的PropTypes.arrayOf()属性中，我传入了一个 PropTypes 对象，PropTypes.arrayOf({})而不是传入PropTypes.shape()egPropTypes.arrayOf(PropTypes.shape({})

Making this change eliminated the error message.

进行此更改消除了错误消息。

回答by Shaun K.

My version of Warning: Failed propType: checker is not a functioncame from forgetting to use PropTypes.shape for an object.

我的版本Warning: Failed propType: checker is not a function来自忘记将 PropTypes.shape 用于对象。

Changing:

改变：

someProps: {
    prop: React.PropTypes.string,
    anotherProp: React.PropTypes.number,
}

to this fixed the problem:

为此解决了问题：

someProps: React.PropTypes.shape({
    prop: React.PropTypes.string,
    anotherProp: React.PropTypes.number,
})

回答by Deepak

I too got this error on putting proptypes in wrong format:

在将 proptypes 置于错误格式时，我也遇到了这个错误：

static propTypes = {
  workHard: PropTypes.func.isRequired,
  winBig: PropTypes.shape({
    prize: { // issue
      PENDING: PropTypes.bool,
    },
  }),
};

Turns out, prop types are expected to be either of type PropTypes.shapeor PropTypes.objectOfwhen it comes to declaring objectprops

事实证明，prop 类型应该是 typePropTypes.shape或者PropTypes.objectOf在声明objectprops 时

So, error was fixed upon changing code to this:

因此，将代码更改为以下错误已修复：

static propTypes = {
  workHard: PropTypes.func.isRequired,
  winBig: PropTypes.shape({
    prize: PropTypes.shape({
      SUCCESS: PropTypes.bool,
    }),
  }),
};

回答by amit

The real explanation behind this issue is that react expects a PropType which is technically a function, aka checker. Examples for checker functions are:

这个问题背后的真正解释是 react 需要一个 PropType ，它在技术上是一个函数，又名checker。检查器功能的示例是：

PropTypes.array
PropTypes.shape({...})
PropTypes.bool

You got the idea... So what happens here is whenever you pass in something which isn't a checker, for example an undefined, react won't know what to do with this and so will complain:

你明白了......所以这里发生的事情是每当你传入一些不是检查器的东西时，例如undefined, react 不知道如何处理这个，所以会抱怨：

checker is not a function

检查器不是函数

In my case, the cause was misspelling of the checker functions:

就我而言，原因是检查器功能的拼写错误：

PropTypes.shape({
    cats: PropTypes.Array // this is undefined
})

The correct version should be:

正确的版本应该是：

PropTypes.shape({
    cats: PropTypes.array // lowercase is correct!
})

回答by Egor

Reactv16

Reactv16

In my version of this errorI had an array of objects:

在我的这个错误版本中，我有一个对象数组：

data: PropTypes.shape([{
  id: PropTypes.number,
  ...
}])

The solution was to make an array of shapes like so:

解决方案是制作一系列形状，如下所示：

data: PropTypes.arrayOf(
  PropTypes.shape({
    id: PropTypes.number,
    ...
  })
)

回答by Dominic

In my case I'd simply accidentally removed a type:

就我而言，我只是不小心删除了一个类型：

grValue: PropTypes, // instead of PropTypes.string

回答by Don Kartacs

One more for the fun of it :) In my case I extracted regularly used models into separate files and imported them. So the proptype definition looked something like this:

还有一个有趣的:) 就我而言，我将经常使用的模型提取到单独的文件中并导入。所以 proptype 定义看起来像这样：

 static propTypes = {
        ...
        selectedAction: shape(ACTION),
        ...
};

My error was that I wrote an additional curly in the shape:

我的错误是我在形状上写了一个额外的卷曲：

static propTypes = {
        ...
        selectedAction: shape({ACTION}),
        ...
};