[英]is missing in props validation react/prop-types
i am getting a below lint error, googled for the error not able to figure whats the problem. 我得到一个下面的lint错误,谷歌搜索错误无法解决问题。 17:20 error 'playerLaughing' is missing in props validation react/prop-types
17:20错误'playerLaughing'在道具验证反应/道具类型中缺失
provding the code below 提供以下代码
C:\workspace\sports-dia-dashboard\src\components\sample-player\player-section.jsx
17:20 error 'playerLaughing' is missing in props validation react/prop-types
17:40 error 'id' is missing in props validation react/prop-types
23:9 warning Unexpected var, use let or const instead no-var
23:53 error 'jumping' is missing in props validation react/prop-types
28:32 warning There should be no space before '=' react/jsx-equals-spacing
28:32 warning There should be no space after '=' react/jsx-equals-spacing
30:37 error 'flying' is missing in props validation react/prop-types
33:21 warning Empty components are self-closing react/self-closing-comp
44:3 error Expected indentation of 4 spaces but found 2 indent
import React from 'react';
class Swimming extends React.Component {
constructor(props) {
super(props);
this.playerLaughing = this.playerLaughing.bind(this);
}
playerLaughing() {
//console.log("playerLaughing");
// debugger;
this.props.playerLaughing(this.props.id);
}
render() {
//console.log("render");
//console.log("accordion / the ExpandCollapse Section component");
var className = 'player-section' + (this.props.jumping ? ' jumping' : '');
return (
<div className={className} onClick={this.playerLaughing}>
<div className = "sports-player-question-flying sports-submenu-dropmenuHeader">
<h3>
{this.props.flying}
</h3>
<div className="up-arrow"></div>
</div>
<div className="body">
{this.props.children}
</div>
</div>
);
}
}
export default Swimming;
You need to set the static property 'propTypes' on the component to satisfy this lint error. 您需要在组件上设置静态属性“propTypes”以满足此lint错误。
Here is some info about React's PropTypes: React Docs 以下是有关React的PropTypes: React Docs的一些信息
You would add a section similar to this: 你会添加一个类似于这样的部分:
import React from 'react';
import PropTypes from 'prop-types';
class Swimming extends React.Component {
static propTypes = {
jumping: PropTypes.bool,
playerLaughing: PropTypes.func
};
constructor(props) {
...
}
You'll need to install the 'prop-types' npm package. 您需要安装'prop-types'npm包。
You should add propTypes
to your component: 您应该将
propTypes
添加到组件中:
For example: 例如:
// this goes outside the class deceleration
Swimming.propTypes = {
playerLaughing: PropTypes.func,
jumping: PropTypes.bool,
//... other props you will use in this component
};
If you want it inside the class
deceleration you can use a static class field like so: 如果你想在
class
减速中使用它,你可以使用静态类字段,如下所示:
// this goes inside the class deceleration
static propTypes = {
playerLaughing: PropTypes.func,
jumping: PropTypes.bool,
//... other props you will use in this component
};
};
You should install and import PropTypes
. 您应该安装并导入
PropTypes
。 see the Docs 看文件
npm install --save prop-types
import PropTypes from 'prop-types'; // ES6
var PropTypes = require('prop-types'); // ES5 with npm
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.