通過json數據反應本地動態主題

Question

在反應原生如何覆蓋我的自定義樣式，其中字體大小和背景色從JSON數據服務器返回的動態樣式？ 我想在我的風格主題中設置JSON數據主題？請給我發送接受JSON數據（如字體大小或顏色）並創建動態主題的那種類型風格的語法？

Answer 1

你總是可以自定義風格的組成部分，假設你有一個組件：

const MyComponent = ({size, color}) => <Text style={{color: color, fontSize:size}}>Hello</Text>; 

在父組件

，你可以像從服務器端檢索您的主題數據

const themeJson = retrieveTheme() // some API call 

假設你在檢索到的JSON數據中有color和size。 你總是可以通過主題顏色和字體大小中MyComponent作爲

<MyComponent color={themeJson.color} fontSize={themeJson.size} /> 

然後，文字大小和顏色會根據主題JSON數據改變。

在反應本機中，樣式定義與反應不同，它使用StyleSheet創建樣式實例，我們無法將其更改爲像我們在React項目中執行的操作（它是JSON對象），如果您想在渲染它，你總是可以將自定義樣式放入數組中，如

const styles= StyleSheet.create({ 
    existStyle={ 
    color: "red", 
    fontSize: 15 
    } 
}); 

const MyComponent = ({size, color}) => 
<Text style={[styles.existStyle, {color: color, fontSize: size}] style={{color: color, fontSize:size}}>Hello</Text>; 

它會覆蓋您在頂部定義的現有樣式。希望它會有所幫助。