2016-03-25 16 views
6

पॉलिमर में कस्टम-स्टाइल बनाम साझा-शैली बनाम <style is="custom-style"> के लिए समर्थन है जो आपको शैलियों को परिभाषित करने की अनुमति देता है जो केवल तत्वों पर लागू होते हैं, उदा। छाया डोम।पॉलिमर

पॉलिमर को <dom-module id="shared-styles"> के लिए भी समर्थन है जो आपको स्टाइल घोषणाओं का एक सेट पैकेज करने की अनुमति देता है जिसे तत्व परिभाषा में आयात किया जा सकता है।

इस प्रकार दोनों का बिंदु आपको बहुलक तत्व शैली बनाने की अनुमति देता है। आप दूसरे पर एक का उपयोग क्यों करेंगे? उपयोग के मामले काफी हद तक ओवरलैप करते हैं, ऐसा लगता है।

अतिरिक्त भ्रम: shared-styles को custom-style में आयात किया जा सकता है। आप ऐसा क्यों करेंगे? क्यों नहीं?

उत्तर

13

<dom-module id="my-shared-styles"> एक पुन: प्रयोज्य शैली मॉड्यूल टोपी घोषित करता है जिसे आप तत्वों या <style is="custom-style"> टैग में आयात कर सकते हैं। एक कस्टम तत्व

<dom-module id="my-element> 
    <template> 
    <style include="my-shared-styles"></style> 
    ... 
    </template> 
</dom-module> 

में या (<head> में उदाहरण के लिए) एक कस्टम तत्व बाहर <style> टैग

<head> 
    <style is="custom-style" include="my-shared-styles"></style> 
</head> 

<style is="custom-style"> केवल जब तुम पॉलिमर सीएसएस सुविधाओं का उपयोग करना चाहते हैं के लिए आवश्यक है में

उपयोग (सीएसएस चर और मिश्रण) एक शैली तत्व में है जो <dom-module> के अंदर नहीं है। <dom-module> के अंदर बस <style> पर्याप्त है।

+0

क्या कोई समस्या है जिसे केवल एक तकनीक के साथ हल किया जा सकता है लेकिन दूसरा नहीं? –

+0

वे दोनों बहुलक सीएसएस सुविधाओं का समर्थन करने के लिए हैं। अंतर वह क्षेत्र है जहां शैलियों को लागू किया जाता है। '<शैली है = "कस्टम-स्टाइल">' में तत्वों को किसी तत्व टेम्पलेट के अंदर सामग्री पर लागू नहीं किया जा सकता है जब तक कि सीएसएस वेरिएबल्स और तत्व शैलियों में तैयार मिश्रित अनुप्रयोगों जैसे हुक न हों। '