Heim > WeChat-Applet > Mini-Programmentwicklung > Lassen Sie uns über verschiedene Methoden zur Übertragung von Seitenparametern in Miniprogrammen sprechen.

Lassen Sie uns über verschiedene Methoden zur Übertragung von Seitenparametern in Miniprogrammen sprechen.

青灯夜游
Freigeben: 2021-10-27 09:41:49
nach vorne
3106 Leute haben es durchsucht

Dieser Artikel stellt Ihnen verschiedene Methoden zur Übergabe von Seitenparametern in Miniprogrammen vor. Ich hoffe, er wird Ihnen hilfreich sein!

Lassen Sie uns über verschiedene Methoden zur Übertragung von Seitenparametern in Miniprogrammen sprechen.

Die Methode zur Übergabe von Seitenparametern im Miniprogramm

URL-Parameterübergabe

ist die gleiche wie die Methode im Web.

index1 Seite

<navigator url="/pages/index2/index2?name=海贼王">页面2</navigator>
Nach dem Login kopieren

oder

    wx.navigateTo({
      url: "/pages/index2/index2?name=海贼王"
    })
Nach dem Login kopieren

index2 Seite

  onLoad: function (options) {
    console.log(options);// { name : 海贼王}
  },
Nach dem Login kopieren

Es ist zu beachten, dass die Seitenparameter nicht in onLoad abgerufen werden können, wenn index2 eine Tabbar-Seite ist. [Verwandte Lernempfehlungen: Mini-Tutorial zur Programmentwicklungindex2 是tabbar页面,那么无法在onLoad中获取页面参数。【相关学习推荐:小程序开发教程

事件通道 EventChannel

如果一个页面由另一个页面通过 wx.navigateTo 打开,这两个页面间将建立一条数据通道:

  • 被打开的页面可以通过 this.getOpenerEventChannel() 方法来获得一个 EventChannel 对象;
  • wx.navigateTosuccess 回调中也包含一个 EventChannel 对象。

这两个 EventChannel 对象间可以使用 emiton 方法相互发送、监听事件。

index1.wxml

<view>
  来自于页面2 传递的数据: {{msg}}
</view>
Nach dem Login kopieren

index1.js

Page({
  data: {
    msg: ""
  },
  onLoad: function () {
    // 1 跳转到页面2
    wx.navigateTo({
      url: "/pages/index2/index2",
      // 2 在成功的回调函数中获取事件通道对象
      success: ({ eventChannel }) => {
        // 3 监听自定义事件
        eventChannel.on("data", (e) => {
          // 4 获取页面2传递过来的数据 设置到 data中
          this.setData({
            msg: e.name
          })
        })
      }
    });
  },
})
Nach dem Login kopieren

index2.js

Page({
  onLoad: function () {
    // 被使用 wx.navigatorTo打开的页面获取获取到一个事件通道对象
    const EventChannel = this.getOpenerEventChannel();
    // 触发事件和传递参数到 页面1中
    EventChannel.emit("data", { name: &#39;海贼王&#39; });
  }
})
Nach dem Login kopieren

本地存储

小程序中的本地存储用法类似web中,可以实现在整个应用中获取数据和存储数据

index1.js

wx.setStorageSync(&#39;data&#39;, {name:&#39;海贼王&#39;});// 可以直接存任意类型的数据
Nach dem Login kopieren

index2.js

wx.getStorageSync(&#39;data&#39;);// 获取
Nach dem Login kopieren

应用全局变量

不同的页面都是处于一个共同的应用当中的,这个应用可以理解为 app.js

app.js

在这里可以定义公共数据

App({
  myData: {
    name: "悟空"
  }
})
Nach dem Login kopieren

index1.js

页面中可以通过 getApp]

Event Channel EventChannel Wenn eine Seite von einer anderen Seite über wx.navigateTo

Öffnen, ein Datenkanal wird zwischen den beiden Seiten hergestellt:

  • Die geöffnete Seite kann über this.getOpenerEventChannel() geöffnet werden </ code>-Methode zum Abrufen eines <code>EventChannel-Objekts;
  • wx.navigateTos success-Rückruf enthält auch einen < code>EventChannel-Objekt.

Die beiden EventChannel-Objekte können die Methoden emit und on verwenden, um sich gegenseitig Ereignisse zu senden und darauf zu warten .

index1.wxml

    let app = getApp();
    console.log(app.myData);
Nach dem Login kopieren
index1.js

    let app = getApp();
    app.myData.name="八戒";
Nach dem Login kopieren
index2.js

🎜
const data = {
  name: "海贼王"
};

module.exports = data;
Nach dem Login kopieren
🎜🎜🎜Lokale Speichernutzung im. Apple Es ähnelt dem im Web und kann in der gesamten Anwendung implementiert werden. Daten abrufen und speichern in 🎜🎜🎜index1.js🎜🎜
const data = require("../../common");
Page({
  onLoad: function () {
    console.log(data);
  },
})
Nach dem Login kopieren
🎜🎜index2.js🎜🎜rrreee🎜🎜🎜Globale Variablen anwenden🎜🎜🎜🎜Verschiedene Seiten befinden sich in einer gemeinsamen Anwendung, diese Anwendung kann sie verstehen Für app.js🎜🎜🎜app.js🎜🎜🎜 können hier öffentliche Daten definiert werden. 🎜rrreee🎜🎜index1.js. Die Seite kann über getApp abgerufen werden rrreee🎜Natürlich können Sie die 🎜rrreee🎜🎜🎜öffentlichen Variablen🎜🎜🎜🎜 auch direkt ändern, eine unabhängige JS-Datei separat definieren und die Daten darin speichern, Sie können 🎜🎜🎜common.js🎜🎜rrreee🎜🎜index1. js🎜🎜 rrreee🎜Weitere Programmierkenntnisse finden Sie unter: 🎜Programmiervideo🎜! ! 🎜

Das obige ist der detaillierte Inhalt vonLassen Sie uns über verschiedene Methoden zur Übertragung von Seitenparametern in Miniprogrammen sprechen.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:juejin.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage