小程序uniapp元素动态样式的写法

1. 在css中使用data里的变量

<template>
    <view class="center" :style="{'--windowWidth':windowWidth}">
    </view>
</template>

<script>
    const windowWidth = uni.getSystemInfoSync().windowWidth+'px';
</script>

<style>
    border-right: var(--window-width) solid transparent;//注意--window-width的写法，可以html里查看写法
</style>

2. 在元素中使用:style

1. 
:style="{'left':item.left+'rpx;','bottom':item.bottom+'rpx'}"

2.
:style="{ height: (isOpen ? height : 0) + 'px' }"

3. 
:style="{width:drawerWidth+'px'}"

4.
:style="'width:'+width+';'+(square?'height:'+width:'')"

5.
:style="{backgroundColor:index<=active&&index!==0?activeColor:index===0?'transparent':deactiveColor}"