NativeBase：覆盖单个元素的样式

Question

我有一个 Text 组件，我只需要为一个屏幕修改它（而不是重新设计整个主题）。我试图遵循 NativeBase 2.0 documentation 但发现它非常混乱。有没有一种简单的方法可以只更改那个元素的样式，而不必将整个主题复制到项目中？

import React, { Component } from 'react';
import { StyleSheet } from 'react-native';
import { ListItem, Grid, Col, Text } from 'native-base';

export default class JobListDetail extends Component {
  render() {
    return (
      <ListItem>
        <Grid>
          <Col>
            <Text style={styles.redText}>Some Text</Text>
            <Text>Another text</Text>
          </Col>
        </Grid>
      </ListItem>
    );
  }
}

const styles = StyleSheet.create({
  redText: {
    color: 'red'
  },
});

Answer 1

NativeBase 文本覆盖 style 的 StyleSheetPropType to become PropTypes.object。

删除 StyleSheet.create 以应用新样式：

const styles = {
  redText: {
    color: 'red'
  },
};

Answer 2

样式已应用，但不断出现警告。

<Text style={labelStyle}>
    {title}
</Text>
const styles = {
    pending: {
        color: '#000'
    },
    complete: {
        textDecorationLine: 'line-through',
        color: '#d8d8d8'
    }
};

这会抛出这里有一个未解决的高优先级问题 https://github.com/GeekyAnts/NativeBase/issues/610

NativeBase：覆盖单个元素的样式

NativeBase: override style on single element

react-native

native-base