WeChat 애플릿에서 보기 레이블 너비와 높이를 변경하는 방법

이 글에서는 뷰 라벨의 폭과 높이를 동적으로 변경하는 위챗 애플릿의 방법을 주로 소개하며, 위챗 애플릿 이벤트 응답과 setData를 사용해 데이터 데이터를 동적으로 운영하는 관련 구현 기술을 소개합니다.

이 글을 참조하세요. WeChat 애플릿은 보기 레이블의 너비와 높이를 동적으로 변경하는 방법을 구현합니다. 다음과 같이 참조용으로 모든 사람과 공유하세요.

Key code

index.wxml file

<view class="view" style="width:{{view.Width}}px;height:{{view.Height}}px;"
>我是view标签，我现在的宽度是{{view.Width}}px,高度是{{view.Height}}px</view>
<input placeholder="输入view标签的宽度" bindinput="viewWidth"></input>
<input placeholder="输入view标签的高度" bindinput="viewHeight"></input>

style="width:{{view.Width}}px;height:{{ view.Height }}px;"값은 이벤트 응답을 통해 동적으로 변경될 수 있으므로 보기 구성 요소의 너비와 높이 스타일이 변경됩니다. style="width:{{view.Width}}px;height:{{view.Height}}px;"可通过事件响应动态改变数值，进而改变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：类似前面文章//www.jb51.net/article/129725.htm介绍过的，可在事件处理函数中添加console.log(e);，在控制台中即可观察到是由e.detail.value

index.js 파일

rrreee

PS: 이전 글 //www.jb51.net/article/129725.htm에서 소개한 내용과 유사하게 console.log(e); code를 추가할 수 있습니다. >, <code>e.detail.value에서 너비와 높이 변경 사항을 가져오는 것을 콘솔에서 확인할 수 있습니다.

위 내용은 제가 여러분을 위해 정리한 내용입니다. 앞으로 도움이 되길 바랍니다.

관련 기사:

laydate.js의 로딩 경로에서 오류가 발생했습니다

javascript를 통해 데이터베이스를 연결하세요

node.js에서 fs.rename을 사용하여 강제 이름 바꾸기를 구현하는 방법

laydate에서 .js의 로딩 경로에 오류가 있습니다

vue-router에서 라우팅 매개변수를 구현하는 방법

jQuery를 사용하여 셀 병합을 달성하기 위해 테이블을 조작하는 방법

🎜애니메이션 효과를 구현하는 방법 그리고 콜백 함수🎜🎜

위 내용은 WeChat 애플릿에서 보기 레이블 너비와 높이를 변경하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!