How to reset margins in react-native?

Still getting used to react-native styling. I noticed that resetting margins works slightly different from normal web. For the context I'm using react-native for web.

If you do the following

<View style=[{ verticalMargin: 10 }, { margin: 0 }] />

My expectation would be the View getting all margins reset to 0, but in fact vertical margin isn't reset, the top and bottom margins keep 10 as their values. That doesn't make sense to me, according to docs

the last style in the array has precedence

Is it because verticalMargin is more specific than margin?

This is common issue we face in react native developments, while working with reusable styles or components.

To fix this margin issue, you may need to reset margin values from each side of the view or any other component.

ex.

<View style={
    [
      {
        marginVertical: 10,
        marginHorizontal: 20
      },
      {
        marginTop: 0,
        marginBottom: 0,
        marginLeft: 0,
        marginRight: 0,
      },
    ]
  }
/>