欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

微信小程序?qū)崿F(xiàn)動(dòng)態(tài)改變view標(biāo)簽寬度和高度的方法【附demo源碼下載】

 更新時(shí)間：2017年12月05日 15:22:58   作者：FutrueJet  
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)動(dòng)態(tài)改變view標(biāo)簽寬度和高度的方法,涉及微信小程序事件響應(yīng)及使用setData針對(duì)data數(shù)據(jù)動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下

本文實(shí)例講述了微信小程序?qū)崿F(xiàn)動(dòng)態(tài)改變view標(biāo)簽寬度和高度的方法。分享給大家供大家參考，具體如下：

1、效果展示

2、關(guān)鍵代碼

index.wxml文件

<view class="view" style="width:{{view.Width}}px;height:{{view.Height}}px;"
>我是view標(biāo)簽，我現(xiàn)在的寬度是{{view.Width}}px,高度是{{view.Height}}px</view>
<input placeholder="輸入view標(biāo)簽的寬度" bindinput="viewWidth"></input>
<input placeholder="輸入view標(biāo)簽的高度" bindinput="viewHeight"></input>

此處設(shè)置的style="width:{{view.Width}}px;height:{{view.Height}}px;"可通過事件響應(yīng)動(dòng)態(tài)改變數(shù)值，進(jìn)而改變view組件的寬高樣式。

index.js文件

var pageData={}
pageData.data={
  view:{
    Width:100,
    Height:100
  }
}
pageData['viewWidth']=function(e){
console.log(e);
  this.setData({
    view:{
      Width:e.detail.value,
      Height:this.data.view.Height
    }
  })
}
pageData['viewHeight']=function(e){
  this.setData({
    view:{
      Width:this.data.view.Width, 
      Height:e.detail.value 
    }
  })
}
Page(pageData)

PS：類似前面文章http://www.dbjr.com.cn/article/129725.htm介紹過的，可在事件處理函數(shù)中添加console.log(e);，在控制臺(tái)中即可觀察到是由e.detail.value獲取寬與高改變數(shù)值。

3、源代碼點(diǎn)擊此處本站下載。

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

相關(guān)文章

最新評(píng)論