prop types not working in react application

Question

I am trying to use proptypes for in my react-redux app, but it is not working, or I am doing something wrong. this is end of code example:

LoginPage.propTypes = {
     login_form: PropTypes.string
};

function mapStateToProps(state) {
     return { loginPage: state.loginPage }
 }

export default connect(mapStateToProps)(LoginPage);

login_form is boolean, and I intentionaly wrote PropType.string to see if it was working but it didn't give me any errors, this is probably because of redux connect,but I couldn't search anything about that. please anyone tell me what I am doing wrong :/ thanks.

Answer 1

From the docs:

When an invalid value is provided for a prop, a warning will be shown in the JavaScript console. For performance reasons, propTypes is only checked in development mode.

If you're running the project that is not in development mode, then you cannot see the warning.

See update below: Also, PropTypes doesn't throw an error but show warning. Be sure to check warning in the console. You might have selected to show error only.

And also, be sure to import the PropTypes from 'prop-types' to work with PropTypes:

import PropTypes from 'prop-types'

---

If the above thing is assured and you still don't see the warning in the console, then there's one probability you pass boolean value in string:

<LoginPage login_form="true" />

Or,

<LoginPage login_form={'true'} />

Be sure to pass boolean value like this:

<LoginPage login_form={true} />

Note: if you want to pass the true value, you may just pass the props like this:

<LoginPage login_form />

Now, having login_form: PropTypes.string will show you warning.

---

Update:

Though react doc says it will throw warning, I just verified that it actually throws an error without application hold. But the message is starting with Warning:. Thus, be sure to check error in the console not warning.

Or, you may be sure to check default.