Maison >interface Web >js tutoriel >Comment modifier la taille du texte dans le mini-programme WeChat

Comment modifier la taille du texte dans le mini-programme WeChat

亚连
亚连original
2018-06-22 15:40:3913342parcourir

Cet article présente principalement l'applet WeChat pour implémenter la fonction de modification de la taille du texte en cliquant sur un bouton, impliquant la liaison d'événements de l'applet WeChat et setData pour modifier dynamiquement les données de la page, puis contrôler les compétences opérationnelles associées au changement dynamique. les attributs d'élément de page, qui sont nécessaires. Les amis peuvent se référer à

Cet article décrit un exemple d'applet WeChat qui implémente la fonction de modification de la taille du texte en cliquant sur un bouton. Partagez-le avec tout le monde pour votre référence, comme suit :

Code clé

fichier index.wxml

<view class="view" style="font-size:{{fontSize}}pt">我是view标签</view>
<button class="btn" type="default" bindtap="magnifyFontSize">点击我字体变大</button>
<button class="btn" type="default" bindtap="shrinkFontSize">点击我字体变小</button>

fichier index.js

Page({
 data:{
  fontSize:10
 },
 magnifyFontSize(){
  this.setData({
   fontSize:this.data.fontSize+1
  })
 },
 shrinkFontSize(){
  this.setData({
   fontSize:this.data.fontSize-1
  })
 }
})

est similaire à l'article précédent. La fonction de réponse à l'événement utilise ici this.setData pour modifier la taille de police en this.data.fontSize+1 ou this.data.fontSize-1, modifiant ainsi dynamiquement la taille de la police de style="font-size:{{fontSize}}pt" dans l'index. fichier wxml.

J'ai compilé ce qui précède pour vous, j'espère que cela vous sera utile à l'avenir.

Articles associés :

À propos de l'utilisation du pseudo-tableau JavaScript (tutoriel détaillé)

Comment extraire des bibliothèques tierces à l'aide de webpack

Optimisation du module JavaScript

Comment utiliser webpack+express pour implémenter le développement de sites multipages

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