vue如何设置和修改原生html的table内的tr标签的高度?

使用vue设置和修改table内的tr的高度

这里的表格是原生html的那个table标签,不是element ui里的数据表格el-table。

表格通过template的v-for循环渲染
html 模板:

<template v-for="item in table">
  <tr :heigth="item.heigth==null?table_Rowheigth:item.heigth"><td>{{item.value}}</td></tr>
</template>

json格式如下:

table_Rowheigth:"30px"
table:[
    {
        value:"test"
        heigth:"50px"
    },
    {
        value:"test"
        heigth:"60px"
    },
        {
        value:"test"
    }

]

如果绑定的json集合中,一个行的数据项有heigth属性,就根据heigth设置该行数据对应行的显示高度,如果行数据没有heigth属性,行数据对应的行的高度配置,设置为table_Rowheigth。
例如以上代码示例中,第三个数据对应的行高度没有显式设置,显示的期待高度是table_Rowheigth的值,也就是30px

但上述那个vue的for循环的html模板不行,如何解决?或者有其他的设置方法?

阅读 3.2k
1 个回答

我寻思不是height吗

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