在 ReactNative: 0.65、Elements: 3.4.2 和 API 29 中，我仍然遇到这种情况，但我找到了一个解决方案，在 View 上设置 overflow:'hidden'，如下所示：

<View style={{
  width:"100%", 
  borderRadius: 30, 
  overflow: 'hidden' 
}}>
  <Button
    title="Login"
    type="solid"
    buttonStyle={{borderRadius: 30}}
  />
</View>

我发现使用 RN Elements 中的 buttonStyle 可以完成工作而无需添加额外的视图。

按钮样式表 BUTTON_STYLES ：

就我而言，我在单独的样式表中添加了 borderRadius ，并在我的按钮组件中引用了它。

export const BUTTON_STYLES = StyleSheet.create({
  buttonStyle: {
    width: 'auto',
    height: 50,
    maxHeight: 50,
    maxWidth: 350,
    borderColor: 'black',
    borderWidth: 1,
  },
  titlePropsStyle: {
    justifyContent: "center",
    alignItems: "center",
    fontWeight: "normal"
  },
})

可重复使用的按钮组件

下面是我使用 React Native Element 组件中的按钮创建的可重复使用的 ButtonComponent 的完整代码，并确保它应用于 buttonStyles 属性：

import React from 'react';
import { Button } from '@rneui/base';

import FONTS from '@app/design/theme/fonts.theme';
import { BASE_COLORS } from '@app/design/theme/colors.theme';
import { BUTTON_STYLES } from './Button.styles';
import { IButtonComponent } from './Button.types';

export const ButtonComponent = ({
  variant = 'primary',
  label,
  disabled = false,
  onPress,
}: IButtonComponent) => {

  const { titlePropsStyle, buttonStyle } = BUTTON_STYLES;
  const buttonColorByVariant = variant === 'primary' ? BASE_COLORS.taekusBlack : BASE_COLORS.taekusWhite;
  const labelColorBtVariant = variant === 'primary' ? BASE_COLORS.taekusWhite : BASE_COLORS.taekusBlack;

  return (
    <Button
      title={label && label}
      onPress={(e) => onPress(e)}
      titleProps={{
        style: {
          ...titlePropsStyle,
          color: labelColorBtVariant
        }
      }}
      titleStyle={{ fontFamily: FONTS.regular }}
      buttonStyle={buttonStyle} // HERE it is referenced
      disabled={disabled}
      color={buttonColorByVariant}
    />
  );
};

按钮的输出如下：

iOS：

Android：