Wie implementiert Reac die Funktion, die Hautfarbe zu ändern?

Der Inhalt dieses Artikels befasst sich mit der Implementierung der Funktion zum Ändern der Hautfarbe. Ich hoffe, dass er für Freunde in Not hilfreich ist.

1. Ziel

Stellen Sie den Benutzern mehrere Designfarben zur Auswahl und ändern Sie dann die Designfarbe der Anwendung entsprechend der Wahl des Benutzers >

2. Implementierungsprinzip 1. Bereiten Sie Stildateien mit verschiedenen Themenfarben vor

2. Notieren Sie die Auswahl des Benutzers im lokalen Cache

3. Alle Wenn Sie die Anwendung aufrufen, lesen Sie den Cache und bestimmen Sie anhand der zwischengespeicherten Informationen, welche Stildatei geladen werden soll.

3. Bereiten Sie vier Stildateien vor, die verschiedenen Themen entsprechen Farben:

 ![](https://images2018.cnblogs.com/blog/1178432/201808/1178432-20180813142303707-1847250400.png)

2. Stellen Sie den Benutzern auf der Homepage eine HTML-Auswahl für die Designfarbe zur Verfügung:

 "
   <span>
               <i></i>
               <i></i>
               <i></i>
               <i></i>
    </span>

   toggleSkin(index){
      setItem('skin',index)  //将最新的主题色名称更新到本地缓存中  
      this.loadingToast('主题色更换中..')
      location.reload()       //主题色更改后刷新页面
  }

"

3. Nachdem die Designfarbe ausgewählt wurde, bestimmt die Eintragsdatei, welcher Designfarbstil geladen werden soll der Cache:

rrree

Ich bin hier auf eine Falle gestoßen, als ich require(

) direkt verwendet habe, aber ich wusste nicht, warum alle vier Stildateien geladen wurden Eines oben, es gab kein Problem.

Verwandte Empfehlungen:

Welche Methoden werden in jQuery häufig verwendet (mit Code)? >./static/css/${aa}.scss

Was ist ein js-Abschluss? JS-Verschlüsse verstehen (mit Code)

Das obige ist der detaillierte Inhalt vonWie implementiert Reac die Funktion, die Hautfarbe zu ändern?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!