ReactJS कई इनलाइन शैलियों

Question

लागू

चलो कहते हैं कि मैं निम्नलिखित शैलियों करते हैं:

const styles = StyleSheet.create({ 
padding: { 
    padding: 10 
}, 
margin: { 
    margin: 10 
} 
}); 

और मैं एक घटक प्रतिक्रिया करने के लिए उन दोनों को लागू करना चाहते हैं?

Answer 1

जब मैं इस बात के लिए कुछ शोध किया, जवाब inmediatly स्पष्ट नहीं है, एक सुझाव है:

<View style={Object.assign({}, styles.padding, styles.margin)}> 
    ... 
</View> 

Object.assign() यदि आप डॉन तर्कों की सूची लेता है और उन्हें विलीन हो जाती है, फिर भी, ' पहले खाली ऑब्जेक्ट को पास नहीं करेगा, यह पहले तर्क को ओवरराइट करेगा, इसलिए यदि आप शैलियों को साफ रखना चाहते हैं तो आपको इसे पास करना होगा।

हालांकि प्रतिक्रिया के रूप में 0.27.2 मुझे ऐसा करने की कोशिश में एक त्रुटि त्रुटि मिली।

कुछ आगे पढ़ने से पता चला:

<View style={StyleSheet.flatten([styles.postHeader, styles.flowRight])}> 
    ... 
</View> 

वर्क्स ठीक है, लेकिन यह बहुत वर्बोज़ और वास्तव में सहज नहीं है, मैं के बाद जब मैं एक और स्निपेट नहीं मिली:

<View style={[styles.postHeader, styles.flowRight]}> 

सभी इरादों और उद्देश्यों के लिए यह वही था जो मैं ढूंढ रहा था।

मैंने अभी इस ज्ञान को साझा करने के बारे में सोचा था क्योंकि यह काफी स्पष्ट लगता है लेकिन मुझे इसके लिए कोई दस्तावेज नहीं मिला।