Maison > interface Web > uni-app > le corps du texte

Comment utiliser des fonctions globales pour transmettre des paramètres entre les composants Uniapp

coldplay.xixi
Libérer: 2023-01-13 00:44:16
original
3947 Les gens l'ont consulté

La méthode d'utilisation des fonctions globales pour transmettre des paramètres entre les composants uniapp : 1. Écoutez la fonction globale dans le composant qui reçoit les paramètres 2. Enregistrez la fonction globale dans le composant qui transmet les paramètres, le code ; est [uni.$emit( ​​'Nom de la fonction', paramètres)].

Comment utiliser des fonctions globales pour transmettre des paramètres entre les composants Uniapp

L'environnement d'exploitation de ce tutoriel : système Windows7, version uni-app2.5.1, ordinateur Dell G3.

Recommandé (gratuit) : Tutoriel de développement d'uni-app

Utilisation de fonctions globales entre les composants uniapp Méthode de passage des paramètres :

1. Surveillez la fonction globale dans le composant qui reçoit les paramètres

uni.$on('函数名',(形参数)=>{
...
});
Copier après la connexion

2. Enregistrez la fonction globale dans le composant qui passe les paramètres

uni.$emit('函数名',参数)

Exemple de code :

Paramètres de réception :

<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>
Copier après la connexion

Paramètres de réussite :

<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>
Copier après la connexion

Recommandations d'apprentissage gratuites associées : Vidéo de programmation

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!