table的行字段折叠效果

问题描述

我想实现点击试算后,产品名称之后的才显示出来,之前都不显示的,类似于折叠的效果,该如何实现呢?用三目运算符吗?

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

图片描述

相关代码

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

<div class="" style="margin-left:10px;margin-top:10px;margin-bottom:10px;">
    <i-button type="success" icon="md-add" @click="addnew">新增</i-button>&nbsp&nbsp&nbsp
    <i-button type="primary" @click="spreadsheet">试算</i-button>
</div>

<tr ref="item" v-for="(item,index) in items" :id="index">
        <td><i-input v-model="item.STOCKCODE" size="small" placeholder="请输入"/></td>
        <td><i-input v-model="item.QUANTITY" size="small" placeholder="请输入"/></td>
        <td><i-input v-model="item.PRICE" size="small" placeholder="请输入"/></td>
        <td><i-input v-model="item.BUSINESS" size="small" placeholder="请输入"/></td>
        <td class="green_bg4">深A股票普通买卖</td>
        <td class="green_bg4">1</td>
        <td class="green_bg4">1</td>
        <td class="green_bg4">9</td>
        <td class="green_bg4">5</td>
        <td class="green_bg4">5555</td>
    </tr>

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

阅读 3.8k
2 个回答

如果只是简单的显示隐藏右边的,用一个布尔值来控制显示隐藏

给表格使用v-if绑定一个参数如isShow,默认给布尔值false的,点击试算,在试算的调用的方法里把isShow装换true;如this.isShow = true

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题