How to use global functions to pass parameters between uniapp components

The method of using global functions to pass parameters between uniapp components: 1. Listen to the global function in the component that receives the parameters; 2. Register the global function in the component that passes the parameters, the code is [uni.$emit( 'Function name', parameters)].

The operating environment of this tutorial: windows7 system, uni-app2.5.1 version, Dell G3 computer.

Recommended (free): uni-app development tutorial

Utilize global functions between uniapp components Method of passing parameters:

1. Listen to the global function in the component that receives the parameters

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

2. Register the global function in the component that passes the parameters

uni.$emit('function name', parameters)

Code example:

Receive parameters:

<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>

Pass parameters:

<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>

Related free learning recommendations: Programming videos

The above is the detailed content of How to use global functions to pass parameters between uniapp components. For more information, please follow other related articles on the PHP Chinese website!