Rumah > applet WeChat > Pembangunan program mini > Bagaimana untuk memindahkan nilai dan kaedah panggilan antara komponen ibu bapa dan anak dalam program mini? (Ringkasan kaedah)

Bagaimana untuk memindahkan nilai dan kaedah panggilan antara komponen ibu bapa dan anak dalam program mini? (Ringkasan kaedah)

青灯夜游
Lepaskan: 2021-12-09 10:03:18
ke hadapan
4685 orang telah melayarinya

Bagaimana untuk memindahkan nilai dan kaedah panggilan antara komponen ibu bapa dan anak dalam program mini? Artikel berikut akan merumuskan dan berkongsi dengan anda beberapa kaedah pemindahan nilai dan kaedah panggilan antara komponen ibu bapa dan anak applet WeChat Saya harap ia akan membantu anda!

Bagaimana untuk memindahkan nilai dan kaedah panggilan antara komponen ibu bapa dan anak dalam program mini? (Ringkasan kaedah)

Pengenkapsulan komponen tersuai

Daftar komponen tab

Buat tab di bawah folder folder komponen, klik tab di sebelah kanan dan anda akan melihat komponen baharu Selepas mengklik pada komponen baharu, pendaftaran berjaya.

Bagaimana untuk memindahkan nilai dan kaedah panggilan antara komponen ibu bapa dan anak dalam program mini? (Ringkasan kaedah)

Komponen menggunakan

untuk mengimport komponen pada halaman json halaman yang perlu menggunakan komponen, seperti Teg HTML di bawah wxml Hanya gunakannya.

Bagaimana untuk memindahkan nilai dan kaedah panggilan antara komponen ibu bapa dan anak dalam program mini? (Ringkasan kaedah)

<tabs></tabs>
Salin selepas log masuk

Apakah komponen induk dan apakah komponen anak? Komponen induk ialah komponen yang perlu memperkenalkan komponen lain ke dalam halaman, dan komponen anak ialah komponen yang diperkenalkan. Ibu bapa menyampaikan nilai kepada anak melalui atribut, manakala anak menyampaikan nilai kepada ibu bapa melalui kaedah.

Komponen induk menghantar nilai kepada komponen anak

Komponen induk melepasi nilai melalui sifat

<childEle childParams="{{params}}"></childEle>
Salin selepas log masuk

Komponen anak melepasi properties Terima:

properties: {
	childParams: { type: String }
}
Salin selepas log masuk

Komponen anak memanggil kaedah komponen induk

Kaedah ini juga boleh difahami sebagai kaedah untuk kanak-kanak komponen untuk menghantar parameter kepada komponen induk .

Komponen induk mentakrifkan kaedah, childFun ialah nama kaedah dalam komponen anak, dan fun ialah nama kaedah dalam komponen induk. Kami memanggil keseronokan melalui childlFun.

<childEle childParams="{{params}}" bind:childFun="fun"></childEle>
Salin selepas log masuk

Kaedah komponen induk:

childFun(e){
	console.log(&#39;我是父组件的方法&#39;, e)
}
Salin selepas log masuk

Kaedah komponen induk dipanggil apabila butang komponen anak diklik untuk melaksanakan clickFun

clickFun(){
	this.triggerEvent(&#39;childFun&#39;);//如果需要传递参数,直接写在triggerEvent的参数里即可
}
Salin selepas log masuk

Komponen induk memanggil kaedah komponen anak

<childEle id="childEle" childParams="{{params}}" bind:childFun="fun"></childEle>
Salin selepas log masuk

Dapatkan elemen childEle dalam kitaran hayat onReady komponen induk

onReady(){
	this.childEle = this.selectComponent(&#39;#childEle&#39;);
}
Salin selepas log masuk

Anak peristiwa klikF komponen induk memanggil anak peristiwa Komponen:

<view bindtap="childF">我是父组件的点击事件</view>
Salin selepas log masuk

Komponen induk mencetus kaedah komponen anak:

childF(){
	this.childEle.foo()
}
Salin selepas log masuk

Foo di sini ialah kaedah komponen kanak-kanak.

[Cadangan pembelajaran berkaitan: Tutorial Pembangunan Program Mini]

Atas ialah kandungan terperinci Bagaimana untuk memindahkan nilai dan kaedah panggilan antara komponen ibu bapa dan anak dalam program mini? (Ringkasan kaedah). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:juejin.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan