ホームページ > 記事 > ウェブフロントエンド > WeChat アプレットでビューラベルの幅と高さを変更する方法
この記事では、WeChat アプレットのイベント応答と、setData を使用してデータを動的に操作する関連実装テクニックを含む、ビュー ラベルの幅と高さを動的に変更する WeChat アプレットの方法を主に紹介します。必要な友人は参考にしてください。例の説明 WeChat アプレットは、ビュー ラベルの幅と高さを動的に変更するメソッドを実装しています。参考として、次のようにみんなと共有してください:
キーコードindex.wxmlファイル
<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;"
値はイベント応答を通じて動的に変更でき、それによってビュー コンポーネントの幅と高さのスタイルが変更されます。
index.js ファイル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
rrreee
console.log(e); コードを追加できます。 > を確認すると、幅と高さの変更が <code>e.detail.value
から取得されていることがコンソールで確認できます。 上記は私があなたのためにまとめたものです。 関連記事:
node.jsでfs.renameを使用して強制的な名前変更を実装する方法
jQueryを使用してテーブルを操作してセルの結合を実現する方法
🎜以上がWeChat アプレットでビューラベルの幅と高さを変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。