javascript - 如何在 React Native 中将两个按钮放在同一行中？

Question

在弹出对话框中，我想将按钮放在同一行，但现在我变成了这样 /image/sJ30p.png.Following是给定的样式。

    <PopupDialog
                    ref={popupDialog => {
                      this.popupDialog = popupDialog;
                    }}
                    dialogStyle={{ backgroundColor: "#ddd", height: 200, width:320, border:10,padding:10}}
                    overlayBackgroundColor="#fff"
                    dismissOnTouchOutside={true}
                         >
                 <View style={styles.dialogContentView}>
                 <Text style={{fontSize:18}}>Are you sure you want to submit?</Text>
                 <View style={styles.button_1}>
                 <Button
    title="Yes"
    onPress={() => {
    console.log('clicked')
    }}
    />
    </View>
    <View style={styles.button_1}>
    <Button
    title="No"
    onPress={() => {
    console.log('clicked')
    }}
    />
    </View>
                </View>
                  </PopupDialog>

.....
....

dialogContentView: {
  flex: 1,
    flexDirection: 'column',
    justifyContent: 'space-between'
},
button_1:{

      width: '40%',
      height: 30,

Answer 1

添加View两者的 parent Button具有样式的组件 flexDirection: 'row'在 </Text> 之后

<View style={{ flexDirection: 'row' }}>
  <View style={styles.button_1}>
    <Button
      title="Yes"
      onPress={() => {
        console.log('clicked');
      }}
   />
   </View>
   <View style={styles.button_1}>
     <Button
       title="No"
       onPress={() => {
         console.log('clicked');
       }}
     />
   </View>
 </View>

你可以试试这个snack