【Vue】我写死的width属性没实现，是因为v-if的原因吗？

问题描述

我给他定死了宽度，但是没按照我设置的属性来进行渲染的，我加了个v-if，是不是这样就导致渲染不了呢？？
【Vue】我写死的width属性没实现，是因为v-if的原因吗？
【Vue】我写死的width属性没实现，是因为v-if的原因吗？

问题出现的环境背景及自己尝试过哪些方法

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

<table width="100%" border="0" cellspacing="0" cellpadding="0" class="customer_cost_table">
<tr class="ivu-table-small">
<th>市场</th>
<th >买卖类别</th>
<th>交易类型</th>
<th>证券类别</th>
<th>数量</th>
<th>价格</th>
<th>笔数</th>
<th width="300px" v-if="hide">产品名称</th>
<th width="80px"  v-if="hide">价格</th>
<th width="80px"  v-if="hide">费率</th>
<th width="80px"  v-if="hide">折扣</th>
<th width="120px"  v-if="hide">附加费</th>
<th width="80px"  v-if="hide">金额</th>
</tr>
<tr ref="tableInfo" v-for="(item,index) in items" :id="index">
<td><i-combox dict="ESC" v-model="item.marKey" valuefield="marKey" textfield="marKey_text"></i-combox></td>
<td><i-combox dict="EMMLB" v-model="item.bsFlag" valuefield="bsFlag" textfield="bsFlag_text"></i-combox></td>
<td><i-combox dict="EJYLX" v-model="item.trdId" valuefield="trdId" textfield="trdId_text"></i-combox></td>
<td><i-combox dict="EZQLB" v-model="item.stkType" valuefield="stkType" textfield="stkType_text"></i-combox></td>
<td><i-input v-model="item.price" size="small" placeholder="请输入"/></td>
<td><i-input v-model="item.qty" size="small" placeholder="请输入"/></td>
<td><i-input v-model="item.count" size="small" placeholder="请输入"/></td>
<td class="green_bg4" v-if="postInfo.length==0 ? false : true">{{postInfo[index].prodName}}</td>
<td class="green_bg4" v-if="postInfo.length==0 ? false : true">{{postInfo[index].priceName}}</td>
<td class="green_bg4" v-if="postInfo.length==0 ? false : true">{{postInfo[index].feeRate}}</td>
<td class="green_bg4" v-if="postInfo.length==0 ? false : true">{{postInfo[index].discount}}</td>
<td class="green_bg4" v-if="postInfo.length==0 ? false : true">{{postInfo[index].feeAmt}}</td>
<td class="green_bg4" v-if="postInfo.length==0 ? false : true">{{postInfo[index].amt}}</td>
</tr>
<tr>
<td colspan="14" align="right" v-if="hide">汇总：<span class="color_red">{{total}}</span></td>
</tr>
</table>

你期待的结果是什么？实际看到的错误信息又是什么？

回答

.customer_cost_table {
    table-layout: fixed;
}

表格单元格的宽度会收表格宽度，单元格内容等影响，并不是你设置了300就是300，有时候表格本身才300宽度，他就会按你设置的比例去缩放，如果你要强制单元格按你设置的宽度就需要增加：table-layout: fixed;

以上是 【Vue】我写死的width属性没实现，是因为v-if的原因吗？ 的全部内容， 来源链接： utcz.com/a/86399.html

回到顶部