Maison  >  Article  >  Applet WeChat  >  Introduction détaillée au passage des paramètres de l'applet WeChat

Introduction détaillée au passage des paramètres de l'applet WeChat

高洛峰
高洛峰original
2017-03-21 16:54:132182parcourir

Cet article présente principalement des informations pertinentes sur l'explication détaillée du transfert de paramètres des mini-programmes WeChat. Les amis dans le besoin peuvent s'y référer

Le lancement des mini-programmes WeChat fera sans aucun doute à nouveau des vagues dans l'industrie de l'Internet mobile. .

Certaines personnes se demanderont si le mini-programme sera populaire. Je ne sais pas s'il sera populaire. Vous pouvez tout comprendre en regardant le nombre d'utilisateurs sur WeChat.

Mini programme WeChat - Passage des paramètres

Ici, j'ai trouvé deux façons de transmettre des paramètres sur le mini programme Pour plus de commodité, je les partagerai avec vous séparément.

1. Paramètre passant par les événements

Regardons d'abord la définition des événements dans le mini programme :

#Qu'est-ce qu'un événement ?

Voici la liste. Les événements texte sont la méthode de communication de la couche vue vers la couche logique.

Voici une liste d'événements textuels qui peuvent renvoyer le comportement de l'utilisateur à la couche logique pour traitement.
Voici une liste d'événements texte qui peuvent être liés au composant. Lorsque l'événement déclencheur est atteint, la
fonction de traitement d'événement correspondante dans la couche logique sera exécutée. Voici le texte de la liste. L'événement
objet peut contenir des informations supplémentaires, telles que l'identifiant, l'ensemble de données, les touches.

souligne clairement qu'il s'agit de la méthode de communication de la couche de vue [w

xml] à la couche logique [js]. , utilisez cet événement. Il est tout à fait correct de transmettre des paramètres. Ensuite, jetons un coup d'œil à l'exemple réel :

View.wxml

b8a2fa940c2096d915a0fa1770f07fa7 Cliquez sur moi ! de5f4c1163741e920c998275338d29b2

logic.js

Page({
 tapName: function(event) {
      console.log(event.target)
 }
})
impression du journal

 微信小程序参数传递详细介绍

Vous pouvez voir que l'ensemble de données contient la valeur de data-hi="MINA" que nous avons définie. Voyons maintenant ce que nous venons d'écrire. Tout d'abord, bindtap. Ce qui commence par bind est de lier un événement à celui-ci. Le nom de cet événement est la valeur après le signe "=". événement lié. Il doit être dans la définition de la couche logique [js ”. Ensuite, il y a le passage de valeur. Les amis qui l'ont remarqué peuvent voir que le data-hi que nous avons écrit ici est la même méthode de définition que le passage de valeur que nous écrivons habituellement en js. Ce data-* correspond à la valeur du dataset dans l'attribut

cible de l'événement. Ce que nous devons appeler ici est event.target.dataset.hi pour obtenir la valeur correspondant à data-hi.

Ici, vous devez faire attention au nom de définition des données : Méthode d'écriture : En commençant par data-, plusieurs mots sont liés par des traits d'union- et ne peuvent pas être mis en majuscule (les majuscules seront automatiquement converties en minuscules), par exemple en tant que type d'élément de données, Enfin, le trait d'union sera converti en type d'élément de cas camel dans event.target.dataset.

Exemple officiel :

<view data-alpha-beta="1" data-alphaBeta="2" bindtap="bindViewTap"> DataSet Test </view>

Page({
 bindViewTap:function(event){
  event.target.dataset.alphaBeta == 1 // - 会转为驼峰写法
  event.target.dataset.alphabeta == 2 // 大写会转为小写
 }
})

2. Paramètre de transmission de l'URL de saut du navigateur

*.wxml

<view class="btn-area">
 <navigator url="navigate?title=navigate" hover-class="navigator-hover">跳转到新页面</navigator>
 <navigator url="redirect?title=redirect" redirect hover-class="other-navigator-hover">在当前页打开</navigator>
</view>
*. .js Après avoir sauté vers une nouvelle page, recevez directement les paramètres dans

onload La méthode de réception est les options.[Valeur du paramètre]

Page({
 onLoad: function(options) {
  this.setData({
   title: options.title
  })
 }
})
D'accord, c'est tout pour aujourd'hui. , notez le lien du document, il est inclus dans le document rédigé ci-dessus. Je les ai simplement déplacés et je les ai dit avec mes mots. …(⊙_⊙;)…

Merci d'avoir lu, j'espère que cela pourra aider tout le monde, merci pour votre soutien à ce site !

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!

Déclaration:
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