アプレットと WXS スクリプトのライフサイクル

1. ライフサイクル


1. ライフサイクルとは

ここに画像の説明を挿入

2. ライフサイクルの分類

ここに画像の説明を挿入

3. ライフサイクル機能とは

ここに画像の説明を挿入

4. ライフサイクル機能の分類

ここに画像の説明を挿入

5. アプリケーションのライフサイクル機能

  • アプレットはで宣言する应用生命周期函数必要がありますapp.js。サンプル コードは次のとおりです。
    ここに画像の説明を挿入

6. ページのライフサイクル機能

  • アプレットは页面生命周期函数page .js 文件で宣言する必要があります。サンプル コードは次のとおりです。
    ここに画像の説明を挿入

2、WXS スクリプト


1.wxsとは

  • WXS(WeiXin Script) はい小程序独有的一套脚本语言、WXML と組み合わせることでページの構造を構築できます。

2. wxsの適用シナリオ

  • wxml 中无法调用在页面的 .js 中定义的函数ただし、wxs で定義された関数は wxml で呼び出すことができます。
  • アプレット内の wxs は典型应用场景" " です过滤器

3. wxs と JavaScript* の関係

ここに画像の説明を挿入

3. WXSの基本構文


1. 埋め込み wxs スクリプト

  • Javascript コードが HTML ファイルの <script> タグに記述できるのと同じように、wxs<wxs>コードは wxml ファイルのタグに記述できます。
  • wxml ファイル内の各 <wxs></wxs> タグは、wxml 内のモジュール内のメンバーを必须提供 module 属性指定し、アクセスを容易にするために使用されます。当前 wxs 的模块名称
    ここに画像の説明を挿入

2. 外部 wxs スクリプトを定義する

  • JavaScript コードを以 .wxs 为后缀名的文件内.js 接尾辞が付いたファイルに記述できるのと同様に、wxs コードも で記述することができます。サンプルコードは次のとおりです。
    ここに画像の説明を挿入

3. 外部 wxs スクリプトの使用

  • wxml に外部 wxs スクリプトを導入する場合、必须<wxs> タグにmodulesrc属性 を追加します。ここで:
    • moduleモジュールの名前を指定するために使用されます
    • srcインポートするスクリプトのパスを指定するために使用されます。必须是相对路径
  • サンプルコードは次のとおりです。
    ここに画像の説明を挿入

4. WXSの特徴


1.JavaScriptとの違い

  • wxs() の学習コストを削減するためにWeiXin Script、wxs 言語は設計時に JavaScript の構文から多くを借用しています。しかし本質的には、wxs と JavaScript はまったく異なる 2 つの言語です。

2. コンポーネントのイベントコールバックとしては使用できません

  • wxs の典型的なアプリケーション シナリオは「过滤器」です。经常配合 Mustache 语法进行使用次に例を示します。
    ここに画像の説明を挿入
  • ただし、関数は wxs で定義されています不能作为组件的事件回调函数たとえば、次のような使用法は間違っています。
    ここに画像の説明を挿入

3. 隔離

  • 隔离性これは、wxs の実行環境が他の JavaScript コードから分離されていることを意味します。それは次の 2 つの側面に反映されます。
    1. wxs は js で定義された関数を呼び出すことができません
    2. wxs はアプレットによって提供される API を呼び出すことができません

4. 優れたパフォーマンス

  • インターネットではiOS设备、アプレット内の JavaScript コードがWXS比較されます。快 2 ~ 20 倍
  • androidデバイス上では、両方の動作効率が无差异

おすすめ

転載: blog.csdn.net/m0_58190023/article/details/129699104