ウィジェットカスタムコンポーネントの使用
1365 ワード
コンポーネントの導入
親コンポーネントは直接サブコンポーネントにパラメータを追加し、値を伝えます.サブコンポーネントは直接受け入れることができます.
受信した値は、dataに入れる必要がなく、ページに直接レンダリングできます.
jsonファイル構成コンポーネント
jsファイル、
親コンポーネントはイベントをカスタマイズし、子コンポーネントはイベントをトリガーして親コンポーネントにパラメータを渡すことができます.
1子コンポーネントが親コンポーネントをトリガーするイベント
2 properties jでパラメータを受け入れる
親コンポーネントは直接サブコンポーネントにパラメータを追加し、値を伝えます.サブコンポーネントは直接受け入れることができます.
受信した値は、dataに入れる必要がなく、ページに直接レンダリングできます.
jsonファイル構成コンポーネント
{
"usingComponents": {
"orderBar":"/components/orderBar/orderBar"
},
"navigationBarTitleText": " "
}
jsファイル、
親コンポーネントはイベントをカスタマイズし、子コンポーネントはイベントをトリガーして親コンポーネントにパラメータを渡すことができます.
orderBarEvent(data){
console.log(data.detail.id)
let index = data.detail.id;
var tabs = this.data.orderBar;
//
tabs.forEach((item, idx) => {
index == idx ? item.active = true : item.active = false;
})
this.setData({
orderBar: tabs
})
// id
},
1子コンポーネントが親コンポーネントをトリガーするイベント
2 properties jでパラメータを受け入れる
properties: {
orderBar:{
type:Array,
//
value:[]
}
},
/**
*
*/
data: {
},
methods: {
tapItem(e){
// id
var index = e.currentTarget.dataset.id;
// , ,
// id item , 。
this.triggerEvent("myEvent",{id:index})
}