道具类型无法将名为 "spacing" 的道具识别为布尔值

Question

这是组件调用：

<Paper spacing>Hello</Paper>

这就是 Paper.js 的样子：

import React from "react";
import PropTypes from "prop-types";

const Paper = ({ children, ...props }) => (
  <div {...props}>
    {children}
  </div>
);

Paper.propTypes = {
  spacing: PropTypes.bool
};

export default Paper;

显然一切正常。但是 PropTypes 给我一个警告：

Warning: Received `true` for a non-boolean attribute `spacing`.

If you want to write it to the DOM, pass a string instead: spacing="true" or spacing={value.toString()}.
    in div (at Paper.js:5)
    in Paper (at src/index.js:9)
    in StrictMode (at src/index.js:8)

https://codesandbox.io/s/prop-types-warning-fnse0

Answer 1

该错误与 proptypes 无关，但与您将布尔属性传递给标记这一事实有关。

您正在将 spacing 属性传递给 div，它不接受间距属性，警告标记不接受布尔值作为其属性值。因此错误。

道具类型无法将名为 "spacing" 的道具识别为布尔值

Prop-types don't recognize the prop called "spacing" as a boolean

warnings

reactjs

react-proptypes