Lassen Sie uns über den Lebenszyklus (Funktion) im WeChat-Applet sprechen-Mini-Programmentwicklung-php.cn

Inhaltsverzeichnis

1. Lebenszyklus

二、生命周期函数

Heim

WeChat-Applet

Mini-Programmentwicklung

Lassen Sie uns über den Lebenszyklus (Funktion) im WeChat-Applet sprechen

青灯夜游

Nov 01, 2021 am 10:24 AM

Mini -Programm Wechat Lebenszyklus

In diesem Artikel werfen Sie einen Blick auf den Lebenszyklus im WeChat-Applet, welche Lebenszyklusfunktionen es gibt und sprechen über den Auslösezeitpunkt und seine Wirkung. Ich hoffe, dass er für alle hilfreich ist!

Lassen Sie uns über den Lebenszyklus (Funktion) im WeChat-Applet sprechen

1. Lebenszyklus

1. Was ist ein Lebenszyklus?

Lebenszyklus (Lebenszyklus) bezieht sich auf die gesamte Phase eines Objekts von der Erstellung über die Ausführung bis zur Zerstörung, wobei der Schwerpunkt auf einem Zeitraum liegt (Life Cycle) 是指一个对象从创建 -> 运行 -> 销毁的整个阶段，强调的是一个时间段

2. 小程序的生命周期

小程序的 启动，表示 生命周期的开始
小程序的 关闭，表示 生命周期的结束
中间小程序运行的过程，就是小程序的生命周期

3. 小程序生命周期分类

应用生命周期特指小程序从启动 --> 运行 --> 销毁的过程
页面生命周期特指小程序中，每个页面的加载 --> 渲染 --> 销毁的过程
注意：页面的生命周期范围较小，应用程序的生命周期范围较大

Lassen Sie uns über den Lebenszyklus (Funktion) im WeChat-Applet sprechen

二、生命周期函数

1. 什么是生命周期函数？

小程序框架提供的内置函数，会伴随着生命周期，自动按次序执行
生命周期函数的作用：
- 允许程序员在特定的生命周期时间点上，执行某些特定的操作
- 例如，页面刚加载的时候，在生命周期函数中自动发起数据请求，获取当前页面的数据
注意：生命周期强调的是时间段，生命周期函数强调的是时间点。

2. 应用的生命周期函数

app.js 是小程序执行的入口文件，在 app.js 中必须调用 App() 函数，且只能调用一次。其中，App() 函数是用来注册并执行小程序的
App(Object) 函数接收一个 Object 参数，可以通过这个 Object 参数，指定小程序的生命周期函数
app.js 中的代码

代码如下（示例）：

App({

  /**
   * 当小程序初始化完成时，会触发 onLaunch（全局只触发一次）
   */
  onLaunch: function () { },

  /**
   * 当小程序启动，或从后台进入前台显示，会触发 onShow
   */
  onShow: function (options) { },

  /**
   * 当小程序从前台进入后台，会触发 onHide
   */
  onHide: function () { },

  /**
   * 当小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息
   */
  onError: function (msg) { }
})

3. 页面的生命周期

每个小程序页面，必须拥有自己的 .js 文件，且必须调用 Page() 函数，否则报错。其中 Page() 函数用来注册小程序页面
Page(Object) 函数接收一个 Object 参数，可以通过这个 Object 参数，指定页面的生命周期函数
page.js

代码如下（示例）：

//index.js
//获取应用实例
const app = getApp()

Page({

  /**
   * 页面的初始数据
   */
  data: { },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) { },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () { },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () { },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () { },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () { },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () { },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () { },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () { }
})

4. 组件的全部生命周期

组件有哪些生命周期？分别是什么时候？

生命周期	参数	描述
`created`	`无`	`在组件实例刚刚被创建时执行`
`attached`	`无`	`在组件实例进入页面节点树时执行`
ready	无	在组件在视图层布局完成后执行
moved	无	在组件实例被移动到节点树另一个位置时执行
`detached`	无	`在组件实例被从页面节点树移除时执行`
error	`Object Error`

Der Start des Miniprogramms stellt den Beginn des Lebenszyklus
den Abschluss< von dar das Miniprogramm< /code>, das das Ende des <code>Lebenszyklus
Der laufende Prozess des Zwischen-Applets ist der Lebenszyklus des Applets

🎜🎜🎜3. Klassifizierung des Programmlebenszyklus🎜🎜🎜

🎜Anwendungslebenszyklus Bezieht sich insbesondere auf den Prozess des Startens –> Ausführens –> des Seitenlebenszyklus Bezieht sich insbesondere auf den Lade--> Rendering--> Zerstörungsprozess jeder Seite im Miniprogramm🎜
🎜🎜Hinweis🎜: Der Lebenszyklusbereich der Seite ist klein und der Lebenszyklus Anwendungsbereich größer🎜

🎜

Lassen Sie uns über den Lebenszyklus (Funktion) im WeChat-Applet sprechen

🎜🎜🎜 2. Lebenszyklusfunktion 🎜🎜🎜🎜🎜 1. Was ist eine Lebenszyklusfunktion? 🎜🎜🎜

🎜Die vom Miniprogramm-Framework bereitgestellten integrierten Funktionen werden zusammen mit dem Lebenszyklus automatisch der Reihe nach ausgeführt🎜
🎜Die Rolle der Lebenszyklusfunktion: 🎜
- Erlauben Sie Programmierern, bestimmte Vorgänge zu bestimmten Lebenszykluszeitpunkten auszuführen
- Wenn die Seite beispielsweise gerade geladen wird, wird in der Lebenszyklusfunktion automatisch eine Datenanforderung initiiert, um die Daten abzurufen der aktuellen Seite
- li>
🎜🎜Hinweis🎜: Der Lebenszyklus betont den Zeitraum und die Lebenszyklusfunktion betont den Zeitpunkt. 🎜

🎜🎜🎜2. Anwendungslebenszyklusfunktion 🎜🎜🎜

🎜app.js ist die Eintragsdatei für die Applet-Ausführung, in App() muss in >app.js aufgerufen werden und kann nur einmal aufgerufen werden. Unter anderem wird die Funktion App() zum Registrieren und Ausführen kleiner Programme verwendet. 🎜
🎜Die Funktion App(Object) erhält einen Object< /code>-Parameter, Sie können diesen <code>Object-Parameter verwenden, um die Lebenszyklusfunktion des Miniprogramms anzugeben🎜
🎜Der Code in app.js</ code>🎜</ li></ul>🎜Der Code lautet wie folgt (Beispiel):🎜<pre class='brush:php;toolbar:false;'>lifetimes: { attached () { console.log(&#39;在组件实例进入页面节点树&#39;) }, detached () { console.log(&#39;在组件实例被从页面节点树移除&#39;) } }, attached () { console.log(&#39;~~~~~在组件实例进入页面节点树&#39;) }, detached () { console.log(&#39;~~~~~在组件实例被从页面节点树移除&#39;) }, /** * 组件的初始数据 */ data: { // rgb 的颜色值对象 _rgb: { r: 0, g: 0, b: 0 }, // 根据 rgb 对象的三个属性，动态计算 fullColor 的值 fullColor: &#39;0, 0, 0&#39; }</pre>🎜🎜🎜3. Seitenlebenszyklus🎜🎜🎜<ul><li>🎜Jede Miniprogrammseite muss ihr eigenes < haben code>.js< /code>-Datei und die Funktion <code>Page() muss aufgerufen werden, andernfalls wird ein Fehler gemeldet. Unter anderem wird die Funktion Page() verwendet, um die Seite des Miniprogramms zu registrieren🎜
🎜Die Funktion Page(Object) empfängt ein Object -Parameter: Sie können die Lebenszyklusfunktion der Seite über diesen Object-Parameter🎜
🎜page.js🎜

🎜Code Wie folgt (Beispiel): 🎜rrreee🎜🎜🎜4. Der gesamte Lebenszyklus von Komponenten🎜🎜🎜🎜Was sind die Lebenszyklen von Komponenten? Wann sind sie unterschiedlich? 🎜🎜

Lebenszyklus	Parameter	Beschreibung
`erstellt`🎜	`Keine`🎜 🎜`Wird ausgeführt, wenn die Komponenteninstanz gerade erstellt wird`🎜🎜
`attached`🎜	`Keine` 🎜🎜`Wird ausgeführt, wenn die Komponenteninstanz in den Seitenknotenbaum eintritt`🎜🎜
bereit🎜	Keine 🎜🎜 in Die Komponente Wird ausgeführt, nachdem das Ansichtsebenenlayout abgeschlossen ist🎜🎜
moved🎜	Keine🎜🎜Wird ausgeführt, wenn die Komponenteninstanz an eine andere Position im Knotenbaum verschoben wird 🎜🎜
`freigegeben`🎜	Keine🎜🎜`Wird ausgeführt, wenn die Komponenteninstanz aus dem Seitenknotenbaum entfernt wird</ code>🎜🎜 <tr><td align="center">error🎜<td align="center"><code>Object Error`🎜🎜Wird immer dann ausgeführt, wenn eine Komponentenmethode einen Fehler auslöst🎜🎜🎜🎜 5. 组件主要的生命周期函数 data在哪个生命周期中初始化完毕？组件的生命周期，指的是组件自身的一些函数，这些函数在特殊的时间点或遇到一些特殊的框架事件时被自动触发。最重要的生命周期是 `created`, `attached`, `detached` ，包含一个组件实例生命流程的最主要时间点。组件实例刚刚被创建好时， `created` 生命周期被触发此时还不能调用 `setData` 通常情况下，这个生命周期只应该用于给组件 this 添加一些自定义属性字段在组件完全初始化完毕、进入页面节点树后， `attached` 生命周期被触发 `this.data` 已被初始化完毕这个生命周期很有用，绝大多数初始化工作可以在这个时机进行在组件离开页面节点树后， `detached` 生命周期被触发退出一个页面时，会触发页面内每个自定义组件的`detached` 生命周期被触发如果组件还在页面节点树中，则 `detached` 会被触发。此时适合做一些清理性质的工作 6. lifetimes 节点同时以两种方式声明生命周期函数，会执行哪个？生命周期方法可以直接定义在 `Component` 构造器的第一级参数中，组件的的生命周期也可以在 `lifetimes` 字段内进行声明（这是推荐的方式，其优先级最高） lifetimes: { attached () { console.log('在组件实例进入页面节点树') }, detached () { console.log('在组件实例被从页面节点树移除') } }, attached () { console.log('~~~~~在组件实例进入页面节点树') }, detached () { console.log('~~~~~在组件实例被从页面节点树移除') }, /** * 组件的初始数据 */ data: { // rgb 的颜色值对象 _rgb: { r: 0, g: 0, b: 0 }, // 根据 rgb 对象的三个属性，动态计算 fullColor 的值 fullColor: '0, 0, 0' } 更多编程相关知识，请访问：编程入门！！ Das obige ist der detaillierte Inhalt vonLassen Sie uns über den Lebenszyklus (Funktion) im WeChat-Applet sprechen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website! 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 Heiße KI -Werkzeuge Undress AI Tool Ausziehbilder kostenlos Undresser.AI Undress KI-gestützte App zum Erstellen realistischer Aktfotos AI Clothes Remover Online-KI-Tool zum Entfernen von Kleidung aus Fotos. Clothoff.io KI-Kleiderentferner Video Face Swap Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus! Mehr anzeigen Heißer Artikel Variabler PHP -Bereich erklärt 1 Monate vor By 百草 Code in PHP aus dem Code ausgehen 1 Monate vor By 百草 <🎜>: Wachsen Sie einen Garten - Komplette Leitfaden für reisende Händler 4 Wochen vor By Jack chen Tipps zum Schreiben von PHP -Kommentaren 1 Monate vor By 百草 Schicksal 2: Der Rand des Schicksals - wie Schwierigkeitsmodifikatoren funktionieren 4 Wochen vor By DDD Mehr anzeigen Heiße Werkzeuge Notepad++7.3.1 Einfach zu bedienender und kostenloser Code-Editor SublimeText3 chinesische Version Chinesische Version, sehr einfach zu bedienen Senden Sie Studio 13.0.1 Leistungsstarke integrierte PHP-Entwicklungsumgebung Dreamweaver CS6 Visuelle Webentwicklungstools SublimeText3 Mac-Version Codebearbeitungssoftware auf Gottesniveau (SublimeText3) Mehr anzeigen Heiße Themen Laravel-Tutorial 1605 29 PHP-Tutorial 1511 276 Mehr anzeigen Related knowledge Sehen Sie sich die offizielle Seite von NIS Comics online für kostenlose Comics an. Die Free -Eintrags -Website der NIS Comics -Anmeldeseite Jun 12, 2025 pm 08:18 PM Nice Comics, eine immersive Leserfahrungsplattform, die sich der Erstellung von Comicliebhabern widmet, vereint eine große Anzahl hochwertiger Comic-Ressourcen im In- und Ausland. Es ist nicht nur eine Comic -Leseplattform, sondern auch eine Community, die Comic -Künstler und Leser verbindet und die Comic -Kultur teilt. Mit einfachem und intuitivem Schnittstellendesign und leistungsstarken Suchfunktionen können Sie mit NES Comics Ihre Lieblingswerke problemlos finden und ein reibungsloses und komfortables Leseerlebnis genießen. Verabschieden Sie sich von den langen Warten und mühsamen Operationen, betreten Sie sofort die Welt der netten Comics und beginnen Sie Ihre Comic -Reise! Kann ich WeChat gleichzeitig auf zwei Telefonen verwenden? Jul 11, 2025 am 03:28 AM Ja, aber es gibt Einschränkungen. ① Sie können sich sowohl für iPhone als auch auf Android -Telefonen bei demselben Konto anmelden. Wenn Sie sich jedoch beim neuesten Gerät anmelden, wird die früheste Sitzung offline sein. ② Sie können sich gleichzeitig auf dem Mobiltelefon und dem Computerdesktop anmelden, aber die Funktionen werden nicht synchronisiert. Obwohl die Verwendung von Tools von Drittanbietern oder Dual-App-Funktionen die Protokollierung zwischen zwei Mobiltelefonen ermöglichen kann, wird sie inoffiziell unterstützt und kann gegen Vorschriften verstoßen. ④ Zu den alternativen Lösungen gehört die Verwendung der Webversion/der Desktop -Version, die zum Haupttelefon entspricht, oder über die Übertragung von Chat -Datensätzen über Cloud -Sicherungs- und Datei -Tools. Einige Android -Maschinen können auch "Dual -Anwendungen" verwenden, um zwei Kontoinstanzen auszuführen. Wie lade ich Huobi auf Android -Handys herunter? Huobi Download Tutorial (Schritt-für-Schritt-Tutorial) Jun 12, 2025 pm 10:12 PM Benutzer von Android Mobiltelefonen können die Huobi/Huobi -App in den folgenden Schritten herunterladen und installieren: 1. Stellen Sie sicher, dass das Netzwerk stabil ist und der Speicherplatz ausreicht; 2. Laden Sie die App über die offizielle Website von Huobi/Huobi herunter, greifen Sie mit dem Browser auf die offizielle Website zu und klicken Sie auf den Link Download oder scannen Sie den QR-Code. Suchen Sie und laden Sie sie über Anwendungsgeschäfte von Drittanbietern wie AppTreasure und Huawei-App-Markt herunter und laden Sie sie herunter. 3. Suchen Sie die heruntergeladene .APK -Datei, aktivieren Sie die Berechtigung "Unbekannte Quell -App", befolgen Sie die Eingabeaufforderungen, um die Installation abzuschließen usw. Yiou Exchange -Download- und Installationspaket Yiou Android Download und Installationspaket Jun 12, 2025 pm 10:09 PM Die Schritte zum Herunterladen und Installieren des Yiou Exchange (OKX) Android Client sind wie folgt: 1. Laden Sie das offizielle echte Installationspaket über die offizielle Website www.okx.com oder den offiziellen QR -Code herunter; 2. Suchen Sie die heruntergeladene .APK -Datei im Mobiltelefondateimanager und aktivieren Sie die Installationsberechtigung "Unbekannte Quelle". 3. Klicken Sie auf das Installationspaket und öffnen Sie nach Abschluss der Installation die App und registrieren Sie sich oder melden Sie sich beim Konto an. 4. Richten Sie komplexe Kennwörter ein, aktivieren Sie die sekundäre Überprüfung, ändern Sie regelmäßig Passwörter, halten Sie private Schlüssel und Mnemonik ordnungsgemäß und achten Sie auf Phishing -Websites, um die Sicherheit der Kontos zu gewährleisten. Huobi V10.52.0 Offizielle Android -Version Huobi Android Version Download Tutorial Jun 18, 2025 pm 07:33 PM Die Huobi -App ist die weltweit führende Digital Asset Trading Platform, die sichere, bequeme und professionelle Handelsdienste bietet. Als Plattform, die von Millionen von Benutzern auf der ganzen Welt vertraut ist, unterstützt die Huobi -App Transaktionen verschiedener digitaler Mainstream -Währungen wie Bitcoin und Ethereum und bietet eine Vielzahl von Handelsinstrumenten wie Spot, Verträgen und Hebel. Die neueste Version von V10.52.0 optimiert die Handelsmaschine, verbessert die Geschwindigkeit und Stabilität, fügt eine Vielzahl neuer Handelsfunktionen hinzu und stärkt den Sicherheitsschutz. Huobi (HTX) Neueste App -Download -Methode: Apple/Android Universal Installation Paket erhalten Sie Tutorial Jun 18, 2025 pm 08:00 PM HTX (ehemals Huobi) startet die neueste mobile App, unterstützt Apple- und Android-Systeme und bietet Echtzeit-Markttrends, Transaktionen, Vertragsfinanzmanagement und andere Funktionen an. Benutzer können sie über die offizielle Website, TestFlight oder den App Store herunterladen und installieren. Gate.io Download Tutorial Gate.io Neueste Version Download Jun 18, 2025 pm 07:18 PM Die neueste Version von Gate.io -Anwendung kann über den offiziellen Kanal heruntergeladen und installiert werden. 1. Besuchen Sie die offizielle Website gate.io und überprüfen Sie die URL. 2. Klicken Sie auf den Eingang "App Download" auf der Startseite oder unten. 3. Wählen Sie die Android- oder iOS -Version gemäß dem System aus; 4. Android -Benutzer können die APK -Datei direkt herunterladen oder sie über Google Play installieren. 5. iOS -Benutzer springen zum App Store und klicken Sie auf "Get" zum Herunterladen. 6. Sie können auch den QR -Code der offiziellen Website scannen, um ihn direkt herunterzuladen. Die erste Verwendung erfordert die Sicherheitsüberprüfung und die reale Authentifizierung, das Verständnis von Transaktionsregeln, das Beachten von Ankündigungen und den Schutz der Kontosicherheit. So verwenden Sie PHP, um soziale Freigabefunktionen zu erstellen. PHP Sharing Interface Integration Practice Jul 25, 2025 pm 08:51 PM Die Kernmethode zum Aufbau sozialer Freigabefunktionen in PHP besteht darin, dynamisch Freigabelinks zu generieren, die den Anforderungen jeder Plattform entsprechen. 1. Erhalten Sie zuerst die aktuelle Seite oder die angegebenen URL- und Artikelinformationen. 2. Verwenden Sie Urlencode, um die Parameter zu codieren. 3.. Spleiß und generieren Teilenverbindungen gemäß den Protokollen jeder Plattform; 4. Zeigen Sie Links im vorderen Ende an, damit Benutzer klicken und freigeben können. 5. generieren Sie Dynamik OG -Tags auf der Seite, um die Anzeige der Freigabe inhaltlich zu optimieren. 6. Achten Sie darauf, dass Sie den Benutzereingaben entkommen, um XSS -Angriffe zu verhindern. Diese Methode erfordert keine komplexe Authentifizierung, weist nur geringe Wartungskosten auf und eignet sich für die meisten Anforderungen an den Inhaltsaustausch. See all articles Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！ Über uns Haftungsausschluss Sitemap © php.cn All rights reserved