So lösen Sie das Problem, dass das Uni-Symbol in der App nicht angezeigt wird

Lösungen dafür, dass das Uni-Symbol nicht in der App angezeigt wird: 1. Verwenden Sie keine Vue-Syntax, die von Nicht-H5-Terminals nicht unterstützt wird. 2. Schreiben Sie Stile innerhalb der Komponente. 3. Ändern Sie den Pfad „url(https:/). /alicdn.net)“ ; 4. Verwenden Sie die IP, auf die das Mobiltelefon zugreifen kann, um Netzwerktests durchzuführen.

Die Betriebsumgebung dieses Artikels: Windows 7-System, Uni-App-Version 2.5.1, DELL G3-Computer

Das Uni-Symbol wird in der App nicht angezeigt?

uniapp führt Iconfont-Symbole ein und löst das Problem, dass Iconfont auf echten Geräten nicht angezeigt wird

1. So führen Sie Iconfont-Symbole in uniapp ein

1. Laden Sie zunächst die Projektdatei von der Iconfont-Website herunter. Wie im Bild gezeigt:

2. Entpacken Sie die heruntergeladene Iconfont-Datei, nehmen Sie iconfont.css und legen Sie sie in Ihrem Projektverzeichnis ab

3. Kehren Sie zur Iconfont-Website zurück , klicken Sie, um den Code zu kopieren. Sie benötigen lediglich die Adresse im ttf-Format

4. Öffnen Sie die Datei iconfont.css im Projekt und schreiben Sie den kopierten Code im ttf-Format in @font-face Folgendes:

@font-face {
　　font-family: "iconfont";
　　src: url('https://at.alicdn.com/t/font_2277759_0seoqjijl89r.ttf') format('truetype');
}

5. Fügen Sie abschließend iconfont.css in das Style-Tag von App.vue ein.

6.

2. Lösen Sie das Problem, dass der Iconfont nicht auf dem realen Gerät angezeigt wird.

Problem: Nach dem obigen Vorgang wird das Iconfont-Symbol in H5 normal angezeigt, aber beim Debuggen in der App des realen Geräts wird es gefunden dass die Symbolanzeige nicht erfolgreich war.

Lösung: Offizieller Link: https://uniapp.dcloud.io/matter

1 Es wird die Vue-Syntax verwendet, die von der Nicht-H5-Seite nicht unterstützt wird, und die Schreibmethode ist durch den Mini eingeschränkt Benutzerdefinierte Komponenten des Programms finden Sie unter

2. Schreiben Sie style="xx" nicht direkt in das Komponentenattribut, auf das verwiesen wird

3. /alicdn.net) zur URL (https://alicdn.net), da // auf der App-Seite ein Dateiprotokoll ist

4 Viele Leute verwenden beim Herstellen einer Verbindung die lokale Testdienstadresse (localhost oder 127.0.0.1). Auf der H5-Seite kann auf eine solche Netzwerkadresse nicht zugegriffen werden. Bitte verwenden Sie eine von Ihrem Telefon aus erreichbare IP-Adresse, um eine Verbindung zum Internet herzustellen

Das obige ist der detaillierte Inhalt vonSo lösen Sie das Problem, dass das Uni-Symbol in der App nicht angezeigt wird. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!