web-dev-qa-db-ja.com

React linter airbnb proptypes array

次のPropTypesがあります。

SmartTable.propTypes = {
  name: React.PropTypes.string.isRequired,
  cols: React.PropTypes.array.isRequired,
  rows: React.PropTypes.array.isRequired,
};

しかし、リンターは私に言います：

Prop type array is forbidden、どうすれば変更できますか？

reactjsairbnbreact-proptypeslinter
18
FacundoGFlores

これの可能な解決策（しかし、私はそれは賢くないと思う）：

SmartTable.propTypes = {
  name: React.PropTypes.string.isRequired,
  cols: React.PropTypes.arrayOf(React.PropTypes.string),
  rows: React.PropTypes.arrayOf(React.PropTypes.string),
};
46
FacundoGFlores

私のために働いた解決策の1つ：

配列が必要な場合：

SmartTable.propTypes = {
  name: PropTypes.string.isRequired,
  cols: PropTypes.instanceOf(Array),
  rows: PropTypes.instanceOf(Array),
};

オブジェクトと配列の場合、次のいずれかです。

SmartTable.propTypes = {
  name: PropTypes.string.isRequired,
  cols: PropTypes.instanceOf(Object),
  rows: PropTypes.instanceOf(Array),
};
7
JuzerK

列と行の配列がオブジェクトの場合、shapeを使用するのが好きなので、このようなものになります。

SmartTable.propTypes = {
  name: PropTypes.string.isRequired,
  cols: PropTypes.arrayOf(PropTypes.shape({
    id: PropTypes.string.isRequried,
    value: PropTypes.string,
   })
  rows: PropTypes.arrayOf(PropTypes.shape({
    id: PropTypes.string.isRequried,
    value: PropTypes.string,
   })

};

4
P-A

ショートバージョン：

配列PropTypes.shape([])の場合

オブジェクトPropTypes.shape({})の場合

1
Luka