How to align the first item left, and the second right in a row in react native?

I put two items (e.g. two buttons) in one row. I want to align the firs开发者_如何学JAVAt item left, and align the second item right, which looks like:

How to achieve this in react native using flex?

After some digging, I found there're two easy ways to achieve this:

// first way
<View style={{flexDirection: "row", justifyContent: "space-between"}}>
<Button>B1</Button> // align left
<Button>B2</Button> // align right
</View>

// second way
<View style={{flexDirection: "row"}}>
<Button>B1</Button> // align left
<Button style={{marginLeft: "auto"}}>B2</Button> // align right
</View>