как я могу перезаписать свойство css в react-native

Question

я создал настраиваемую кнопку, <View style={styles.buttonContainer}> <AppButton title="comes in" color="yellow" /> <AppButton title="register now" color="white" /> </View> когда я сохраняю свой код, обе кнопки дают мне одинаковый цвет, поэтому, когда я создал компонент custombutton, я изменяю цвет фона return ( <TouchableHighlight style={[styles.button, { backgroundColor: colors[color] }]} > <Text style={styles.text}>{title}</Text> </TouchableHighlight> ); } but problem is that like this I want to modify marginVertical export default function AppButton({ title, color = "", marginVertical = "" }) { return ( {title} ); } and in welcome screen i called it like this введите описание изображения здесь

Answer 1

Чтобы переопределить marginVertical, вы можете просто передать его, как показано ниже, вместо предоставления ключа и использования массива.

function AppButton({ title, color = '', marginVertical = 0 }) {
  return (
    <TouchableHighlight
      style={[
        styles.button,
        { backgroundColor: colors[color], marginVertical:marginVertical },
      ]}>
      <Text style={styles.text}>{title}</Text>
    </TouchableHighlight>
  );
}

Также, если вы планируете использовать несколько стилей, используйте один объект стиля и переопределите его как показано ниже

function AppButton({ title, style={} }) {
  return (
    <TouchableHighlight
      style={[
        styles.button,
        style,
      ]}>
      <Text style={styles.text}>{title}</Text>
    </TouchableHighlight>
  );
}

Answer 2

по-прежнему отображается значение ошибки 0, я обновил, как вы изменили введите описание изображения здесь