vue 條件渲染方式

一、經過class綁定

<div :class="{'div-class': this.align == 'center'}"></div>

對應的csscss

.div-class {
  height: auto;  
}

其中this.align可放在data或props中this

二、經過三元表達式

<div :style="{ 'height': this.align=='center' ? 'auto' : '' }"></div>

三、經過計算屬性

<div :align="align" :style="getLocality"></div>

在computed中寫對應的計算:spa

computed: {
        getLocality() {
          if(this.align === "center") {
            return "height: auto"
          }
        }
    },
相關文章
相關標籤/搜索