elementUI使用el-card高度自適應


<el-row type="flex">
      <el-col :span="4" v-for="(item, index) in list" :key="index" :offset="index > 0 ?1 : 0">
        <el-card v-if="item.bankName" :body-style="{ padding: '0px' }">
          <div style="padding: 14px;">
            <div class="title">{{item.bankName}}</div>
            <div class="sub-title">{{item.cardType}}</div>
            <div class="text-no">{{item.bankCardNo}}</div>
            <div class="bottom clearfix">
              <el-button type="text" class="button" @click="deleteCount">刪除</el-button>
              <el-button type="text" class="button" @click="checkMsg(item)">查看</el-button>
            </div>
          </div>
        </el-card>
        <el-card v-else class="el-card-define">
          <div class="add-btn" @click="addRealCountHandle">
            <div class="icon-block">
              <svg-icon icon-class="add-icon" />
            </div>
            <div>添加銀行賬戶</div>
          </div>
        </el-card>
      </el-col>
    </el-row>
.el-card-define {
  min-height: 100%;
  height: 100%;
}
.el-card-define >>> .el-card__body {
  height: 100%;
}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2026 CODEPRJ.COM