微信ウィジェットの親子間コンポーネントの参照

1.コンポーネントの作成
微信開発者ツールを開き、コンポーネントを作成すると、wxml、wxss、js、jsonの4つのファイルが生成されます.
wxmlで:

<view>    Aview>

jsで:

Component({

  behaviors: [],

  properties: {

  },
  data: {

  }, //     ，       

  //       ，     ，    methods        
  attached: function () { },
  moved: function () { },
  detached: function () { },

  methods: {

  }

})

jsonで:

{
  "component": true,
  "usingComponents": {}
}

コンポーネントの作成が完了しました
2.コンポーネントの導入
indexにコンポーネントを導入するには
indexでjson:

{
  "usingComponents": {
    "componentA": "../../components/child1/child1"
  }
}

indexでwxml:

<view>
    <view>         view>
    <componentA />
view>

コンポーネントを表示できます.コンポーネントを導入するには、wxmlに表示するには、jsonでコンポーネントを定義します.
3.親コンポーネントから子コンポーネントへの参照
宣言:Aコンポーネントは親コンポーネント、Bコンポーネントは子コンポーネント、以下はAコンポーネントからBコンポーネントへの参照です.
AコンポーネントにBコンポーネントを導入する
Aコンポーネントのjsonに書き込み:

{
  "component": true,
  "usingComponents": {
    "componentB": "../child2/child2"
  }
}

Aコンポーネントのwxmlに次のように書き込みます.

<view>    Aview>
<view>
   <view>     ：view>
   <componentB paramAtoB='  A B      '/>
view>

Bコンポーネントのjsに書き込みます.

Component({

  behaviors: [],

  properties: {
    paramAtoB:String
  },
  data: {

  }, //     ，       

  //       ，     ，    methods        
  attached: function () { },
  moved: function () { },
  detached: function () { },

  methods: {

  }

})

すなわちpropertiesでAコンポーネントが渡すパラメータタイプを定義する
Bコンポーネントのwxmlに次のように書き込みます.

<view style='border:2px solid gray;'>
<view style='text-align:center;'>    Bview>
<view>A      ：{{paramAtoB}}view>
view>

まとめ:AコンポーネントはBコンポーネントにパラメータを伝達し、実際にはAコンポーネントにBコンポーネントを導入するときに、1つの属性paramAtoBを持ってきて、それに値を割り当て、それからBコンポーネントはこの属性名paramAtoBを通じて、その値を取得する
4.子コンポーネントから親コンポーネントへの参照
宣言:Aコンポーネントは親コンポーネントであり、Bコンポーネントは子コンポーネントであり、以下はBコンポーネントがAコンポーネントに参照する.
子コンポーネントを親コンポーネントにパラメータを渡すには、まず、親コンポーネントが子コンポーネントを導入するときに、次のようにトリガイベントを追加します.
親コンポーネントAでwxml:

<view style='padding:20px;border:2px solid red;'>
<view style='text-align:center;'>    Aview>
<view>
   <view>A    ：view>
   <view>B      ：{{paramBtoA}}view>
   <componentB paramAtoB='  A B      ' bind:myevent="onMyEvent"/>
view>

view>

myeventはバインドされたトリガイベントです
親コンポーネントAでjs:

Component({

  behaviors: [],

  properties: {

  },
  data: {

  }, //     ，       

  //       ，     ，    methods        
  attached: function () { },
  moved: function () { },
  detached: function () { },

  methods: {
    onMyEvent:function(e){
      this.setData({
        paramBtoA: e.detail.paramBtoA
      })
    }
  }

})

onMyEventは布団コンポーネントがトリガーされたときの関数です
サブアセンブリBでwxml:

<view style='border:2px solid gray;'>
<view style='text-align:center;'>    Bview>
<view>A      ：{{paramAtoB}}view>
  <button bindtap='change'> A     button>
view>

buttonボタンクリックイベントがトリガーされると、パラメータが親コンポーネントAに入力され、子コンポーネントBにjs:

Component({

  behaviors: [],

  properties: {
    paramAtoB:String
  },
  data: {

  }, //     ，       

  //       ，     ，    methods        
  attached: function () { },
  moved: function () { },
  detached: function () { },

  methods: {
    change:function(){
      this.triggerEvent('myevent', { paramBtoA:123});
    }
  }

})

this.triggerEventはボタンをクリックして実行するイベントで、myeventイベントをトリガーし、パラメータparamBtoAを入力して親コンポーネントに入ります.
以上が微信ウィジェットの親子コンポーネント間のパラメータで、後期に新しい発見があれば不定期に更新されます!
ソースアドレス:https://github.com/CandyGo/wx-component-param