Question

我有一个数组作为必需对象中的非必需属性，我想为此数组提供一个默认值。

const { classes, eItem } = props;

eItem: PropTypes.shape({
   eList: PropTypes.arrayOf(PropTypes.shape({
      id: PropTypes.number.isRequired,
      nameSurname: PropTypes.string.isRequired,
      img: PropTypes.string,
   })),
}).isRequired,

Example.defaultProps = {
   eItem: { 
      eList: [] 
   },
};

我已经这样写了defaultProps，但是我发现eList在控制台中是未定义的。

如何为eList提供默认值作为空数组？

Answer 1

这是为您的名词必填项编写默认道具的最佳实践，因为对组件的保证是将必需的道具传递给它们。

因此，在您的情况下，请删除多余的不必要的默认道具，然后将默认项传递给默认道具，例如：

Example.defaultProps = {
   eItem: { 
      eList: [
         id: Some default number,
         nameSurname: "Some default text",
         img: "default path for a placeholder item ",
      ] 
   },
};

Answer 2

尝试这种形状

ReactComponent.propTypes={
  eItem:PropTypes.shape({
    eList: PropTypes.arrayOf(PropTypes.shape({

      id:PropTypes.number ,
      nameSurname: PropTypes.string,
      img: PropTypes.string
    }).isRequired

  })}

添加defaultProps作为此形状

ReactComponent.defaultProps = {
  eItem: { 
  eList: [
{id:10,nameSurname:"ddddfd",img:"mjjkjkjskdj"}
],
}

对所需对象中的数组属性反应默认属性

2 个答案: