微信小程式把玩(九)scroll view元件

2021-09-07 09:27:30 字數 1222 閱讀 8071

原文:

scroll-view為滾動檢視,分為水平滾動和垂直滾動。注意滾動檢視垂直滾動時一定要設定高度否則的話scroll-view不會生效。滾動檢視常用的地方一般都是item項比較多的介面,比如我的模組

主要屬性:

使用演示:

wxml

scroll-y="true"

style="height: 200px">

style="background: red; width: 100px; height: 100px" >

view>

style="background: green; width: 100px; height: 100px">

view>

style="background: blue; width: 100px; height: 100px">

view>

style="background: yellow; width: 100px; height: 100px">

view>

scroll-view>

scroll-x="true"

style=" white-space: nowrap; display: flex" >

style="background: red; width: 200px; height: 100px; display: inline-block" >

view>

style="background: green; width: 200px; height: 100px; display: inline-block">

view>

style="background: blue; width: 200px; height: 100px; display: inline-block">

view>

style="background: yellow; width: 200px; height: 100px; display: inline-block">

view>

scroll-view>

微信小程式把玩(七)資料繫結

資料繫結有一部分前幾個看著還行,後面的幾個可能有幾個不理解,介面展示的資料有的也因為條件沒法顯示。看不懂的可以先記著,後面真正用到時就會明白,反正我是這樣想的。這裡先記錄下 data.wxml view id item 元件屬性view wx if 控制屬性view hindden 三元運算子vie...

微信小程式把玩(十七)input元件

input輸入框使用的頻率也是比較高的。樣式的話自己外面包裹個view自己定義。input屬性也不是很多,有需要自己慢慢測,嘗試 主要屬性 placeholder 請輸入賬號 placeholder style color red bindinput listenerphoneinput view ...

微信小程式把玩(十一)icon元件

原文 這些是提供的所支援的圖示樣式,根據需求在此基礎上去修改大小和顏色。主要屬性 使用方式 wxml type success size 40 type safe success size 40 type info size 40 type info circle size 40 type succ...