All parent elements including view-box specify height: 100%
Manually specify the padding-bottom and padding-top of the view-box
The documentation says that it can be specified with the attributes body-padding-top and body-padding-bottom, but this is actually wrong
The correct ones are bodyPaddingBottom and bodyPaddingTop. Wrong documentation kills people
<view-box :bodyPaddingBottom="bodyPaddingBottom" :bodyPaddingTop="bodyPaddingTop">
Dynamic settings
mounted: function () {
this.bodyPaddingTop = this.$refs.header.$el.clientHeight + 'px';
this.bodyPaddingBottom = this.$refs.bar.$el.clientHeight + 'px';
},
In addition, if you design a fixed column yourself, in order to avoid the content cover, you need to specify box-sizing: border-box for the container; then set padding or insert an empty div
border-box means that borders and padding do not count towards the height of the container content