在Vue中怎么样为一个元素设置动态的高度 比如数据列表的高度

在Vue中怎么样为一个元素设置动态的高度 比如数据列表的高度 有时候比如我可以点击按钮隐藏我的分页，也可以隐藏我的搜索条件区域，这样的话我的表格区域是不一样的

在dom中设置 :height="height" data中定义height
点击隐藏展示分页以及隐藏展示查询的时候调用这个方法

getHeight() {
                let that = this 
                that.height = window.innerHeight - 10 + 'px' //这里还要根据分页以及查询区域的展示情况 减去他们两个的高度两个可以通过ref获取
                window.onresize = () => {
                    that.height = window.innerHeight - 10 + 'px' //这里还要根据分页以及查询区域的展示情况 减去他们两个的高度两个可以通过ref获取

                }
            },

Mounted中在调用his.getHeight（）。这样一进页面就让他计算一次

可以 用 v-bind 绑定 style属性 或者class属性 。再或者 行内样式都行。 然后 用变量 控制就行

我这边拿若依举下例

img

img

可以设置隐藏与显示，这个时候再搭配楼上同学代码，减掉你对应的页码高度 搜索框高度就可以实现对应效果，同样的你可能需要依据自己的项目情况修改一下，获取节点你可以获取对应的右侧绿框的高度变更时你也应该重新的调用一下进行适配

img