一褒侧、props傳值
props傳值在WePY中屬于父組件與子組件之間(包括頁面與其子組件之間)傳值的一種機(jī)制,包括靜態(tài)傳值與動(dòng)態(tài)傳值谊迄。
靜態(tài)傳值只能傳遞String類型闷供,不能傳遞Number、Boolean统诺、Object等其他類型歪脏。
動(dòng)態(tài)傳值使用`:prop`(等價(jià)于`v-bind:prop`),子組件會(huì)接收父組件的數(shù)據(jù)粮呢。
與靜態(tài)傳值只能通過父組件向子組件單向傳值不同婿失,動(dòng)態(tài)傳值包括了單向動(dòng)態(tài)傳值和雙向動(dòng)態(tài)傳值。
+??1. 單向動(dòng)態(tài)傳值:父組件向子組件單向動(dòng)態(tài)傳值(父組件可隨時(shí)改變子組件中的值)啄寡。
+??2. 雙向動(dòng)態(tài)傳值:子組件props對(duì)象中某個(gè)屬性值的修改會(huì)改變父組件data對(duì)象中對(duì)應(yīng)屬性的值(注意豪硅,父子組件中的這兩個(gè)屬性其名稱可以不一致,兩者通過在父組件wxml中插入子組件時(shí)在子組件標(biāo)簽的屬性中進(jìn)行映射關(guān)聯(lián))挺物。
sync懒浮,和twoWay 這里都是單向,區(qū)別是识藤,一個(gè)是父到子嵌溢,一個(gè)是子到父眯牧。
page_parent.wpy
<btnctl :selectItemId.sync="selectItemid"></btnctl>
<script>
data = {
selectItemid:'szsaaq'
}
}
onLoad( options ) {
this.selectItemid=options.id
}
}
</script>
child.wpy組件
props = {
selectItemId:{}
}
methods = {start (m) {
console.log("選擇的測(cè)試題id:"+this.selectItemId)
}}
onLoad(){
console.log(this.selectItemId)//子組件onLoad方法先于父組件執(zhí)行蹋岩,所以是默認(rèn)值
}
二赖草、子組件傳遞給父組件=》頁面
采用emit
child.wpy
methods = {
start (m) {
this.$emit('parentFn',this.selectItemId);
}
}
page_parent.wpy
<child @child.user="parentFn"></child>
methods={
parentFn(e){
console.log(e)
}
}
三、`$invoke`是一個(gè)組件對(duì)另一個(gè)組件的直接調(diào)用剪个,通過傳入的組件路徑找到相應(yīng)組件秧骑,然后再調(diào)用其方法。
`$invoke`是一個(gè)頁面或組件對(duì)另一個(gè)組件中的方法的直接調(diào)用扣囊,通過傳入的組件路徑找到相應(yīng)組件乎折,然后再調(diào)用其方法。
①比如侵歇,想在頁面`Page_Index`中調(diào)用組件btnctl中的某個(gè)方法sendMessage:
```Javascript
this.$invoke('btnctl', 'someMethod', 'someArgs');
```
②如果想在組件A中調(diào)用組件btnctl的某個(gè)方法sendMessage:
```Javascript
this.$invoke('../btnctl', 'sendMessage', this.selectItemId);