नया नोड जोड़ने के बाद रीफ्रेश/री-रेंडर कैसे करें?

त्वरित उत्तरद्वारा bgrand-ch

फ़ाइल TextEditor.vue अनुकूलित: लेकिन समस्या बनी हुई है: ✔️ span नोड चयन की पिछली सामग्री को font-family और color शैलियों के साथ बदल देता है। ❌ span नोड GrapesJS द्वारा पहचाना नहीं जाता है, क्योंकि GrapesJS ऑटो-जनरेट की गई शैलियों आईडी और data-gjs-type='text' विशेषता नहीं है। ❌ संशोधनों को सहेजने के लिए getHTML और getJ...

नीचे पूरा उत्तर पढ़ें ↓

प्रश्न

मैं मैन्युअल रूप से एक प्रदान किए गए घटक में एक नया नोड जोड़ता हूं। दृश्य परिणाम ठीक है, लेकिन सहेजना असंभव है, क्योंकि मेरी शैली ऑटो-जनरेटेड GrapesJS आईडी के साथ नहीं है। इस पॉब्लेम को मैन्युअल रूप से हल करने के लिए, मैं इसमें प्रवेश करने के लिए घटक पर डबल-क्लिक करता हूं और मैं कैनवास बॉडी में बाहर क्लिक करता हूं। फिर, GrapesJS आईडी और data-gjs-type='text' को नए नोड में जोड़ा जाता है, और सहेजना संभव है। Vue.js: Main.vue फ़ाइल का एक हिस्सा: फ़ाइल TextEditor.vue का एक हिस्सा:

जवाब (3)

bgrand-ch• 8 जनवरी 2021

bgrand-ch• 11 जनवरी 2021

i️ सीधे HTML के साथ काम नहीं करता है, केवल JSON के साथ काम करता है। घटक = JSON नोड (html तत्व + GrapesJS डेटा) स्रोत: https://grapesjs.com/docs/modules/Components.htmlhttps://grapesjs.com/docs/api/component.html

GJSBlock• 17 मई 2026

इसकी रिपोर्ट करने के लिए धन्यवाद, @bgrand-ch. नए नोड जोड़े जाने के बाद रीफ्रेश/री-रेंडर कैसे करें? के बारे में बढ़िया सवाल?। ProseMirror के साथ अनुशंसित दृष्टिकोण ईवेंट-संचालित एपीआई का उपयोग करना है। यहाँ से शुरू करें: अपने विशिष्ट मॉड्यूल के लिए GrapesJS दस्तावेज़ की जाँच करें on() ईवेंट श्रोता व...

GitHub पर पूरी चर्चा देखें →