javascript - propTypes isRequired constraint mis-leading behaviour in react - Stack Overflow

admin管理员组

文章数量:1326474

I'm very new to react( or to say web technologies). I started building an app which uses different ponents. When I went through the documentation, I thought putting isRequired in propTypes, constrains the user to provide all isRequired attributes when using the ponent.

But, in this example even if I don't pass isRequired attributes I'm able to load the ponent.

var PanelPreview = React.createClass({
    getInitialState: function(){
       return { captionIndex: 0 };
    },
    propTypes: {
       beforeSrc: React.PropTypes.string.isRequired,
       afterSrc: React.PropTypes.string.isRequired,
       captionTable: React.PropTypes.array
    },
});
module.exports = PanelPreview;

app using this ponent:

   React.render(
      < PanelPreview />,
      document.getElementById('main')
   );

I want to constrain the user of the ponent to provide these two values else throw some sort of error.

I'm very new to react( or to say web technologies). I started building an app which uses different ponents. When I went through the documentation, I thought putting isRequired in propTypes, constrains the user to provide all isRequired attributes when using the ponent.

But, in this example even if I don't pass isRequired attributes I'm able to load the ponent.

var PanelPreview = React.createClass({
    getInitialState: function(){
       return { captionIndex: 0 };
    },
    propTypes: {
       beforeSrc: React.PropTypes.string.isRequired,
       afterSrc: React.PropTypes.string.isRequired,
       captionTable: React.PropTypes.array
    },
});
module.exports = PanelPreview;

app using this ponent:

   React.render(
      < PanelPreview />,
      document.getElementById('main')
   );

I want to constrain the user of the ponent to provide these two values else throw some sort of error.

• javascript
• reactjs

Share Improve this question Follow edited Jul 12, 2018 at 8:07 Aliaksandr Sushkevich 12.4k88 gold badges4141 silver badges4646 bronze badges asked Nov 13, 2014 at 12:29 mAcmAc 19911 gold badge33 silver badges99 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 7

Props failing validation isn't currently considered a critical error. However there will be a warnning logged in the console:

Warning: Required prop `beforeSrc` was not specified in `PanelPreview`.

This only happens in a non-production build of react. In production nothing is logged. See this fiddle for an example http://jsfiddle/5mafp3eu/1/

There has been discussion about having React fail-fast for prop validation failures (see issues below), it seems like it's going to happen eventually, but I don't think it's on any roadmap yet.

• https://github./facebook/react/issues/1587
• https://github./facebook/react/issues/1753

本文标签： javascriptpropTypes isRequired constraint misleading behaviour in reactStack Overflow