uniapp开发微信小程序如何使遍历的元素有不同样式

小程序没有dom对象，使得浏览器中的document对象方法无法使用，这样就使得获取元素并改变元素的样式变得困难，特别是遍历的元素，只能通过css获取元素并改变元素样式，但css改变的样式值是固定的，如果遍历元素很多就很难一一改变，好的方法是将遍历元素的属性写为变量，通过改变变量的方式改变属性，小程序中常用行内样式来做到这一点

<view class="chiyun">
        <view  :class="txt[index]" v-for="(item,index) in dataxin" 
        :style="{color:wh,top:vTop[index]+ 'px',left:wLeft[index]+ 'px'}"
        :id="'tx'+index"
        >{{item.text}}</view>
    </view>

上面这段代码中，就是通过行内样式给遍历元素赋予不同的位置值,top和left属性通过数组变量vTop[index]与left:wLeft[index]来赋予，这两个变量可以在data中直接定义数组，也可以mounted中运行方法往数组里添加随机数，这样就能赋予遍历元素不同的css效果

        

 大家可以扫码或是搜索小程序星座运势查一查，里面星座名称位置随机出现的效果就是通过上面方法做出来的