VUE+ElementUI development background function, hide the left menu bar and then expand the white box

recently, I used VUE+ElementUI to develop background functions. After deployment, I found that clicking on the minimize left menu and then expanding it would lead to a white box. I don"t know what to do. I would appreciate it if I asked God for help.

clipboard.png

Mar.04,2021

Thank you for your reply from the first floor. The problem has been solved. According to the Big God code in the csdn comment area, the principle is the same as what the first floor said. Post code:

add the value of offsetWidth in the left navigation bar of monitoring to 0 in the collapse function in methods to modify it. Because you want to get the offsetwidth attribute of the element, remember to add an ID value to the element. My lastclass, is added as follows:

<!---->
                <el-menu :default-active="$route.path" id="lastclass" class="el-menu-vertical-demo" @open="handleopen" @close="handleclose" @select="handleselect"
                     unique-opened router v-show="!collapsed">
< H2 > modify the function as follows: < / H2 >
collapse:function(){
                this.collapsed=!this.collapsed;
                var uiwidth = document.getElementById('lastclass');
                if(uiwidth.offsetWidth===0){
                    uiwidth.style.width = "230px"
                }
            },

is your layout problem, you can dynamically control the width of the menu on the left.

Menu