no-inline-styles fails with unary minus

[martinmacko47]

Assume component:

class Foo extends Component {
  render() {
    return (
      <View>
        <Text style={{margin: -this.props.margin}}>Bar</Text>
      </View>
    )
  }
}

Then no-inline-styles reports:

10:22  error  Inline style: { margin: NaN }              react-native/no-inline-styles

It fails to recognize that -this.props.margin is an expression. It does not report for this.props.margin (without the minus sign) nor for -1 * this.props.margin.

eslint-plugin-react-native version: 3.2.1 eslint version: 4.16.0

[Intellicode]

This rule is about not allowing inline styles, It should report the same for the other cases though

[martinmacko47]

Documentation says:

This rule detects inline style objects when they contain literal values. If inline styles only contain variable values, the style is considered acceptable because it's sometimes necessary to set styles based on state or props.

Clearly both this.props.margin and -this.props.margin are variable values.

[Intellicode]

@martinmacko47 you can still disable this rule for these specific cases, or you can create a PR to solve this issue :)

[martinmacko47]

I worked around it using -1 * this.props.margin instead of -this.props.margin.

I'll create a PR when I'll get to it. Assuming I'll be able to fix it.

[SnowCoderAlex]

I sent a PR #188 that fixes this issue

[serhiipalash]

@Intellicode can you make new release with this fix?

I still see this error. I think it's because the last one release was on Jan 11 and this bug fix was merged on Mar 5.

Thanks!