本文實例講述了微信小程序基于slider組件動態(tài)修改標簽透明度的方法。分享給大家供大家參考，具體如下：

1、效果展示

2、關(guān)鍵代碼

index.wxml

<view class="img" style="opacity:{{imgOpacity}}"></view><slider min="0" max="1" step="0.1" show-value value="1" bindchange="changeImgOpacity"/>

此處的opacity:{{imgOpacity}}綁定data中的imgOpacity:1，用于表示圖片透明度。同時bindchange="changeImgOpacity"綁定事件處理函數(shù)changeImgOpacity用于改變圖片透明度。

index.js

var pageData={}pageData.data={ imgOpacity:1}pageData['changeImgOpacity']=function(e){//console.log(e) this.setData({  imgOpacity:e.detail.value })}Page(pageData)

這里使用setData設置透明度imgOpacity，讀者可使用console.log(e)在控制臺獲取影響imgOpacity改變的e.detail.value，如下圖：

這里還是用了slider組件，該組件主要有以下幾個屬性：

3、源代碼點擊此處本站下載。

希望本文所述對大家微信小程序開發(fā)有所幫助。