Comment changer le style des éléments avec un mini programme

1. Obtenez le style de l'élément

Utilisez wx.createSelectorQuery() pour obtenir l'élément

Ce dont vous avez besoin à noter ici : La fonction pour obtenir le style de l'élément doit être placée dans onReady : function(){}

let that = this
const query = wx.createSelectorQuery()
query.select('.detail-card').boundingClientRect()
query.select('.detail-header').boundingClientRect()
query.exec((res => {
    that.setData({
        cardHeight: res[0].height,
        headerHeight: res[1].height
    })
}))

2. Modifier le style de l'élément

L'idée ici est d'utiliser style pour donner à une variable le style des éléments en WXML, et de modifier l'attribut top en modifiant le tableau topList

<view 
    class="detail-card" 
    style="top:{{topList[index]+&#39;px&#39;}};z-index:{{index}}" 
    id="{{&#39;card&#39;+index}}" 
    wx:for="{{people}}" 
    wx:key="{{index}}" 
    catchtap="cardClick"
>
</view>

Site PHP chinois, un un grand nombre de tutoriels gratuits de développement de petits programmes, étude bienvenue !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!