I.要約：カスタムコンポーネントを通じて、組立方法、コンポーネントのライフサイクルを使用し、パラメータ渡し、スタイルを紹介するカスタムコンポーネントのバナーと呼ばれます
ジャンプページ上のテキストやクリックがパラメータとして渡された内部のバナーコンポーネントは、ページ上部のトップバナーの関数であり、
このリファレンス
https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/component.html
第二に、技術的なポイント：
1.コンポーネントのライフサイクル寿命
2.コンポーネントのプロパティは、プロパティのプロトタイプ
3.組立方法方法
4.使用するスタイルクラスアセンブリ
第三に、プロジェクトが開始します
テキストに接続され、我々はまだ、次のファイルが下に作成されたプロジェクトのフォルダ構成部品の「開発コンポーネント」と呼ばれるプロジェクトを使用します
バナーフォルダには、当社の構成部品の本体であります
私たちは、その後、ファイルbanner.jsonで次のフォルダに記入します
彼はコンポーネントであること
次のファイルbanner.jsに記入
次の三つの新しいプロパティ、物品の主な内容であるコンポーネントのメソッド、プロパティ、コンポーネント、コンポーネントのライフサイクルのプロトタイプ
我々は、テキストバナーショーを特定したい場合は、コンポーネント定義にテキストという名前のprototypeプロパティをしてみましょう
入ってくる成分の性質にプロトタイプが文字列から変換する必要があるため、図は、その値がデフォルト値の値であり、明示的にタイプを指定する必要があります。他の属性の宣言方法があり、参照は公式文書かもしれ
banner.wxmlでは、我々は、直接テキストを表示しました
app.jsonに、グローバル基準成分
その後、我々はここでprototypeプロパティを使用することをindex.wxml、ノートでコンポーネントを使用します。
、
あなたは、コンポーネントに定義された当社のプロパティ値は、デフォルト値に設定された渡されていないアセンブリに導入され、prototypeプロパティの内部データの一部も構成要素である、見ることができ、それはまた、データはその後、結合くださいすることができます私たちは、あなたがその値this.data.XXXX方法を取得することができ、ことがわかります
その後、我々は、スタイルクラスのコンポーネントを定義する必要がbanner.wxssに次のコードを書きます
.banner { ディスプレイ：フレックス。 フレックス方向：コラム。 正当化-コンテンツ：センター ; ALIGN-アイテム：センター ; 背景色：赤。 色：白 ; 幅：100％ ; 高さ：100rpx。 位置：固定 ; トップ：0PX。 左：0PX。
Zインデックス：1。
}
そして、ルートbanner.wxmlは、スタイルを結合します
保存、私たちは私たちの基本的なスタイルは、仕事をするだろう、ページがそのようなになっていることに注意してくださいすることができます
その後、我々は、タップイベントにページにジャンプするためのパスとバインド方法を示すために、prototypeプロパティコンポーネントを追加します
ユーザーが記入していない場合は、我々はどこ組立状態を判断するためにライフサイクルメソッドを取り付けたので、どこ、空の文字列「」になります場所。それは「」パスであれば、我々は彼に、現在のページを与えました
次のように完全なコードです
成分（{ データ：{}、 メソッド：{ 後藤：関数（）{ wx.navigateTo（{ URL：この.data.where、 }） } }、 プロパティ：{ テキスト：{ タイプ：文字列 値：「热烈欢迎" }、 ここで：文字列 }、 寿命：{ 添付：関数（）{ CONSTページ = getCurrentPages（） constのページ =ページ[pages.length-1 ] であれば（この .data.where == '' ） この.setData（{ ここで： ` / $ {page.route}` }） } } }）
私たちのバナーコンポーネントをクリックすると、ページが現在のページに送られ、見ることができます
私たちは、例えば、単にデフォルトのプロジェクトは、私たちのために、ログ・ページを提供し、プロパティを設定した場合。私たちは、このページにルーティング見えます
バナーをクリックして、あなたは成功したエントリのログを見ることができます
成功したバナーコンポーネント
