加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

reactjs – 提取/读取React propTypes

发布时间:2020-12-15 20:52:57 所属栏目:百科 来源:网络整理
导读:我想直观地测试React组件.用户可以使用表单更改组件的道具.我想要(例如)呈现 select基于React.PropTypes.oneOf([‘green’,’blue’,’yellow’]). 当我读取MyComponent.propTypes它返回由React定义的函数.有没有办法提取/阅读道具类型? 您不能直接从propTy
我想直观地测试React组件.用户可以使用表单更改组件的道具.我想要(例如)呈现< select>基于React.PropTypes.oneOf([‘green’,’blue’,’yellow’]).

当我读取MyComponent.propTypes它返回由React定义的函数.有没有办法提取/阅读道具类型?

您不能直接从propTypes读取,因为正如你所说,它们被定义为函数.

您可以以中间格式定义您的propTypes,从中生成您的propTypes静态.

var myPropTypes = {
  color: {
    type: 'oneOf',value: ['green','blue','yellow'],},};

function processPropTypes(propTypes) {
  var output = {};
  for (var key in propTypes) {
    if (propTypes.hasOwnProperty(key)) {
      // Note that this does not support nested propTypes validation
      // (arrayOf,objectOf,oneOfType and shape)
      // You'd have to create special cases for those
      output[key] = React.PropTypes[propTypes[key].type](propTypes[key].value);
    }
  }
  return output;
}

var MyComponent = React.createClass({
  propTypes: processPropTypes(myPropTypes),static: {
    myPropTypes: myPropTypes,});

然后,您可以通过MyComponent.myPropTypes或element.type.myPropTypes访问自定义的propTypes格式.

这是一个帮助,使这个过程更容易一些.

function applyPropTypes(myPropTypes,Component) {
  Component.propTypes = processPropTypes(myPropTypes);
  Component.myPropTypes = propTypes;
}

applyPropTypes(myPropTypes,MyComponent);

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读