首頁 >web前端 >uni-app >uniapp元件之間如何利用全域函數傳參

uniapp元件之間如何利用全域函數傳參

coldplay.xixi
coldplay.xixi原創
2020-12-09 15:11:443997瀏覽

uniapp元件之間利用全域函數傳參的方法:1、在接收參數的元件中監聽全域函數;2、在傳遞參數的元件中註冊全域函數,程式碼為【uni.$emit( '函數名',參數)】。

uniapp元件之間如何利用全域函數傳參

本教學操作環境:windows7系統、uni-app2.5.1版本,Dell G3電腦。

推薦(免費):uni-app開發教學

uniapp元件之間利用全域函數傳參的方法:

1、在接收參數的元件中監聽全域函數

uni.$on('函数名',(形参数)=>{
...
});

2、在傳送參數的元件中註冊全域函數

   uni.$emit('函數名稱',參數)

程式碼範例:

#接收參數:

<template>
<view>meme {{this.num}}</view>
</template>
<script>
export default{
data()
{
return{
num:12
}
},
created()
{
uni.$on(&#39;update&#39;,(num)=>{
this.num=num;
});
}
}
</script>
<style>
</style>

傳遞參數:

<template>
<view>
<button type="primary" @click="get">按钮</button>
<me></me>
</view>
</template>
<script>
import det from &#39;../detail/detail.vue&#39;
import me from &#39;../me/me.vue&#39;
export default{
data()
{
return{
imgArr:[&#39;a&#39;],
num2:11
}
},
components:{
det,
me
},
methods:{
get()
{
uni.$emit(&#39;update&#39;,this.num2);
}
}
}
</script>
<style scoped>
@import url("../css/a.css");
.box{
height: 375rpx;
width: 375rpx;
/* #ifdef H5 */
background-color: #4CD964;
/* #endif */
/* #ifdef APP-PLUS */
background-color: #007AFF;
/* #endif */
}
.box1{
background-color: #007AFF;
}
</style>

相關免費學習推薦:程式設計影片

#

以上是uniapp元件之間如何利用全域函數傳參的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn