So zeigen Sie die Tableiste in Uniapp an

So zeigen Sie die Tableiste in Uniapp an: Zuerst stellt das erste Element im Seitenarray die Anwendungsstartseite dar; dann konfigurieren Sie es in der Datei [page.js], der Code lautet ["Pfad": "pages/show/show". ","style ": {"navigationBarT】

Die Betriebsumgebung dieses Tutorials: Windows7-System, Uni-App2.5.1-Version, diese Methode ist für alle Computermarken geeignet

Empfohlen (kostenlos). ): uni-app. Entwicklungs-Tutorial

So zeigen Sie die Tableiste in Uniapp an:

Schauen Sie sich zunächst die offizielle Website an, um mehr über tabBar zu erfahren.

Wenn es sich bei der Anwendung um eine Multi-Tab-Anwendung handelt, können Sie dies tun Geben Sie die Leistung der Tab-Leiste über das TabBar-Konfigurationselement sowie die Anzeige beim Tab-Wechsel an.

• Wenn die Position auf „oben“ eingestellt ist, wird das Symbol in der TabBar nicht angezeigt , und es können nur mindestens 2 und maximal 5 Registerkarten konfiguriert werden. Die Registerkarten werden in der Reihenfolge des Arrays sortiert.

• Die Registerkartenleiste wird möglicherweise nicht rechtzeitig gerendert kann im onLoad-Lebenszyklus jeder Tabbar-Seite eine Warteschneeflocke auftauchen lassen (Hallo Uni-App verwendet diese Methode). löst das onShow jeder Seite aus und löst das onLoad nicht erneut aus.

• Die obere Tableiste wird derzeit nur vom WeChat-Applet unterstützt. Wenn ja, wird empfohlen, nicht die obere Einstellung der Tableiste zu verwenden, sondern die Top-Tab selbst. Sie können auf hello uni-app->Template->Top tab verweisen.

• Zweitens, konfigurieren Sie es in der page.js-Datei

  {
  "pages": [ //pages数组中第一项表示应用启动页，
  {
  "path": "pages/index/index",
  "style": {
  "navigationBarTitleText": "uni-app"
  }
  }
      ,{
              "path" : "pages/show/show",
              "style" : {
  "navigationBarTitleText": "show"
  }
          }
          ,{
              "path" : "pages/component/component",
              "style" : {
  "navigationBarTitleText": "component"
  }
          }
      ],
  "globalStyle": {
  "navigationBarTextStyle": "black",
  "navigationBarTitleText": "uni-app",
  "navigationBarBackgroundColor": "#F8F8F8",
  "backgroundColor": "#F8F8F8"
  },
  "tabBar": {
      "color": "#F0AD4E",
      "selectedColor": "#3cc51f",
      "borderStyle": "black",
      "backgroundColor": "#F8F8F8",
      "list": [{
          "pagePath": "pages/index/index",
          "iconPath": "static/logo.png",
          "selectedIconPath": "static/logo.png",
          "text": "首页"
      },{
          "pagePath": "pages/component/component",
          "iconPath": "static/logo.png",
          "selectedIconPath": "static/logo.png",
          "text": "组件"
      }, {
          "pagePath": "pages/show/show",
        "iconPath": "static/logo.png",
        "selectedIconPath": "static/logo.png",
          "text": "展示"
      }]
  } 
  }

  Nach dem Login kopieren
  Wird nicht angezeigt, wenn ich zwei Seiten in der „tabBar“ konfiguriert habe. Ich weiß nicht, ob dieses Problem aufgetreten ist. Die Konfiguration ist wie folgt
• Verwandte kostenlose Lernempfehlungen:

  PHP-Programmierung

  (Video)

Das obige ist der detaillierte Inhalt vonSo zeigen Sie die Tableiste in Uniapp an. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!