Proptype warning when using StyleSheet on rightTextStyle

[danielforsberg]

Hi,

So if I use StyleSheet to apply the style like this:

const AppCheckBox = ({onClick, rightText}) => {
  return (
    <CheckBox
      onClick={onClick} rightText={rightText}
      rightTextStyle={styles.rightText} />
  )
}

const styles = StyleSheet.create({
  rightText: {flex: 0, color: '#FFF', fontFamily: 'Arial', fontSize: 20}
})

I get this warning:

Warning: Failed prop type: Invalid prop rightTextStyleof typenumbersupplied toCheckBox, expected object.

But this works:

const AppCheckBox = ({onClick, rightText}) => {
  return (
    <CheckBox
      onClick={onClick} rightText={rightText}
      rightTextStyle={{flex: 0, color: '#FFF', fontFamily: 'Arial', fontSize: 20}} />
  )
}

[charleycesar]

I'm get the same error

[ziyafenn]

@danielforsberg @charleycesar Problem is that you applied View props to Text props, and therefore you get this error.

Remove flex from style, should be fine.

[Jaewoook]

@danielforsberg @charleycesar

To fix this problem, we can try to fix some ways:

1. Flatten style

use StyleSheet.flatten(styles.rightText)

2. Change propTypes object in this checkbox component

static propTypes = {
    ...
    rightTextStyle: PropTypes.instanceOf(StyleSheet)
    ...
}

Today, I found to use instanceOf emit warning message into log. but it seems no problem to use.