對所有文本組件應答原生應用樣式

是否有一種簡單的方法將樣式應用於特定類型的所有組件，例如Text或ScrollView等，原生反應生成模板？
例如，我希望將verdanafontFamily樣式用於所有場景中的所有文本組件。每次使用Text組件時，是否有一種簡單的方法可以實現，而不是指定樣式？
或者是否需要創建自定義文本組件？並用它代替基本組件，如下面的例子。使用MyText代替Text對所有文本組件應答原生應用樣式

const MyText = ({data}) => <Text style={style.commonTextStyle}>{data}</Text>

來源

2016-12-10 suman j

您可以提取常見的樣式，併爲他們提供全球。你可以根據需要爲每個文本視圖添加/編輯樣式。

export default StyleSheet.create({ 
    container: { 
    flex: 1, 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    welcome: { 
    fontSize: 20, 
    textAlign: 'center', 
    margin: 10, 
    }, 
})

然後u可以使用<Text style={[styles.welcome, {color:'red'}]]}>Hello</Text>

ü應該考慮像庫react-native-extended-stylesheet

您也可以按照有關如何保持樣式表簡單readble這些技術。
參考Tips for styling React

來源

2016-12-11 06:57:49 Vicky

與這不會幫助我問。每個用戶在使用Text組件時都需要確保在整個代碼庫中提供正確的樣式。我正在尋求一種通用的解決方案，例如在HTML中爲特定標籤提供css。看來唯一的解決方案就是像我在問題中提到的那樣創建一個自定義組件，如MyText。 –

@sumanj你能接受我的回答嗎？或者自己輸入一個來標記這個問題並幫助其他面臨同樣問題的人？ – eden

除了Vicky的回答，您可以簡單地創建與名稱文字或MYTEXT等新組件，並將其導入到你的項目當您需要它。

function MyText(props) { 
    return (
    <Text style={styles.MY_CUSTOM_STYLES}> 
     {props.children} 
    </Text> 
); 
}

而且使用它像，

import MyText from '/path/to/MyText'; 

... 

render() { 
    return (<MyText>Now I have my custom styles.</MyText>); 
}

您可以通過，如果你覺得這樣來定義文本部件更改其名稱中使用它作爲導入文本。進一步閱讀請參閱this documentation。 （注意：上述MYTEXT組件是輕量級定義一個functional stateless component）

來源

2016-12-11 07:57:37 eden

您必須創建一個RN組件是這樣的：

/* @flow */ 

import React, { Component } from 'react'; 
import { Text as TextRN } from 'react-native'; 

export default class Text extends Component { 
    render() { 
    return (
     <TextRN style={[YOUR_CUSTOM_STYLES, this.props.style]}> 
     {this.props.children} 
     </TextRN> 
    ) 
    } 
}

這樣，你自己的文本組件可以繼承來自其他樣式任何地方你使用它們。

注意：請記住，您自己的自定義文本組件不能在所有情況下使用，例如，在TouchableHighlight中，在這種情況下，您必須使用react-native庫中的原生文本。現在

，你就可以改變你的進口：

import Text from 'YOUR_PATH/Text.js'

希望這有助於。

來源

2017-04-12 15:45:45

https://github.com/Ajackster/react-native-global-props似乎爲大部分反應原生組件（包括文本，視圖等）提供全局樣式.GitHub中的自述文件包含示例。這似乎解決了需求，但我還沒有測試過。

來源

2017-09-25 02:52:12

Glamorous也處理這個非常乾淨利落地做出反應母語：

const MyText = glamorous.Text({ 
    // ... any styles 
}); 

export MyText;

來源

2017-11-30 17:21:33

對所有文本組件應答原生應用樣式

回答

相關問題