Heim  >  Artikel  >  WeChat-Applet  >  WeChat-Applet-JS-Implementierungscode zum dynamischen Ändern von Stilen

WeChat-Applet-JS-Implementierungscode zum dynamischen Ändern von Stilen

高洛峰
高洛峰Original
2017-02-18 12:27:353200Durchsuche

Die Gefahr des WeChat-Applets besteht darin, dass js den Stil dynamisch ändern kann. Wir können dies nicht einfach mit js oder jq mit einer Codezeile tun. Oder verwenden Sie „removeClass addClass“, um den Stil zu ändern.

Das Folgende ist eine Methode zum dynamischen Ändern von Stilen. Das Prinzip besteht darin, Daten zu binden und sie dann dynamisch zu ändern, um dynamische Stiländerungen zu erreichen. Es fühlt sich ein bisschen... so seltsam an. Aber wir konnten nichts tun. Wenn Sie eine bessere Methode haben, können Sie diese im Kommentarbereich teilen.

test.wxml

<view style="text-align: center;">
 <label style="color:{{color}};">我会变色</label>
 <button bindtap="clickRed">变红</button>
 <button bindtap="clickgreen">变绿</button>
</view>

test.js

Page({
 data: {
 color: "red"
 },
 clickRed: function () {
 this.setData({
  color: "red"
 })
 },
 clickgreen: function () {
 this.setData({
  color: "green"
 })
 }
})

Effekt

微信小程序 JS动态修改样式的实现代码

Das Obige ist der vom Herausgeber eingeführte Implementierungscode für den dynamischen JS-Modifikationsstil Wenn Sie Fragen haben, hinterlassen Sie mir bitte eine Nachricht und ich werde Ihnen rechtzeitig antworten. Ich möchte mich auch bei Ihnen allen für Ihre Unterstützung der chinesischen PHP-Website bedanken!

Weitere Artikel zum Implementierungscode des dynamischen Modifikationsstils des WeChat-Applets JS finden Sie auf der chinesischen PHP-Website!


Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn