Duplizierte CSS während der Erstellung mehrerer Seiten

Question

GrapesJS-Version [X] Ich bestätige, die neueste Version von GrapesJS zu verwenden Welchen Browser benutzt du? Neueste Chrome-Meldung Reproduzierbarer Demo-Link https://codesandbox.io/s/withered-bush-wv29dx?file=/index.js Beschreibe den Käfer Wie reproduziert man den Bug?... Erstelle mehrere Seiten in grapesjs.init()... Überprüfen Sie die Stile jeder Seite Was ist das erwartete Verhalten? jede Seite enthält ihren eigenen Stil, ohne das CSS anderer Seiten einzuschließen ... Wie ist das aktuelle V...

artf · Accepted Answer

Das ist beabsichtigt und ich habe nicht vor, dieses Verhalten zu ändern, da man leicht spezifische CSS-Selektoren erstellen kann, wenn man pro Seite unterschiedliche Stile benötigt. Der große Vorteil dieses Ansatzes ist, dass Selektoren seitenübergreifend wiederverwendet werden können.

Hasan-aa · Answer

Ich glaube, ich habe ein Problem mit diesem Ansatz. Ich speichere die Seiten auf dem Server so: '''JS const component = page.getMainComponent(); const css = editor.getCss({ component, avoidProtected: true }) saveToBackendApi(component,css) Die CSS-Regeln, die auf IDs abzielen, funktionieren einwandfrei, aber die Regeln für eine Klasse duplizieren sich, selbst wenn sie auf separaten Seiten geladen werden. Zum Beispiel steigt die # der CSS-Regeln für die Klasse '.gjs-row' nach jedem Save + Laden...

GJS Helper · Answer

Das Problem, das Sie mit dupliziertem CSS über mehrere Seiten in GrapesJS haben, ist ein häufiger Verwirrungspunkt im Zusammenhang damit, wie GrapesJS Styles global innerhalb einer Editor-Instanz verwaltet. Standardmäßig sammelt GrapesJSs 'CssComposer' (die Komponente, die für die Verwaltung aller CSS-Regeln zuständig ist) Styles. Wenn Sie mehrere Seiten mit ihren jeweiligen 'Styles'-Eigenschaften initialisieren, werden diese Styles zum globalen 'CssComposer' hinzugefügt und bleiben auf allen S...

Duplizierte CSS während der Erstellung mehrerer Seiten

Frage

Antworten (3)

Verwandte Fragen und Antworten

PropertyComposite mit Schieberegler für vier Seiten (L,R,T,B). Eine Änderung eines Schiebereglers führt dazu, dass andere Werte zurückgesetzt werden.

SetStyle/getCss() erzeugt duplizierte CSS

Während Border-Style für die HTML-Komponente css json hinzugefügt wird, der nur für den Border-Selector abruft, nicht der Border-Width-, Border-style, border-colorBUG:

CSS, das über benutzerdefinierten Code hinzugefügt wurde, bleibt bestehen, nachdem die benutzerdefinierte Codekomponente entfernt wurde

Kostenpflichtige Plugins, die diesem Problem entsprechen

Durchsuchen Sie Plugin-Kategorien