【问题标题】:Can a default value be used in a proptype shape?可以在 proptype 形状中使用默认值吗?
【发布时间】:2021-04-28 23:13:37
【问题描述】:

是否可以为具有所需键值对和默认键值对的对象定义类型?

例子:

const myComponent = (props) => {
  const {
    myObject: {
      someRequiredString,
      someNotRequiredString,
    }
  }
}

myComponent.propTypes = {
  myObject: PropTypes.shape({
    someRequiredString.string.isRequired,
  }).isRequired,
}

myComponent.defaultProps = {
  myObject: {
    someNotRequiredString: '',
  }
}

【问题讨论】:

  • 通常必填字段没有默认值
  • 是的,但是如果对象同时具有必填字段和非必填字段呢? @VadimHulevich

标签: javascript reactjs react-proptypes


【解决方案1】:

所以如果我理解你是正确的,你需要非必需的对象位,如果这个对象存在,它必须有 2 个必填字段,也许有一个非必填字段

所以我们来了:

componentForUser.propTypes = {
    myObject: PropTypes.shape({
        name:PropTypes.string.isRequired,
        secondName:PropTypes.string.isRequired,
        age:PropTypes.string,
    }),
}

componentForUser.defaultProps = {
    myObject: {
        name: 'defaultName',
        secondName: 'defaultSecondName',
        age:21
    }
}

在这种情况下,如果不需要 User 对象,您将获得带有属性的 User:

myObject: { name: 'defaultName', secondName: 'defaultSecondName', age:21 }

但是如果从道具中你会得到没有名字的对象用户,你会收到关于所需名称和第二个名字的警告。

【讨论】:

  • 所以诀窍是不要在 propTypes 中的对象上设置.isRequired。完美!
【解决方案2】:

也许自从提出这个问题后情况已经改变,但你不能为这样的嵌套值提供 defaultProps。

【讨论】:

  • 不,根据this answer,但解释了一种解决方法。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-11-26
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-08-19
相关资源
最近更新 更多