在页面加载的时候使用 onLoad加载
如下代码
onLoad() {
console.log("132131241241")
let res = wx.getSystemInfoSync()
this.width = res.screenWidth
this.bottom = res.screenHeight
this.wrapperHeight = res.screenHeight
},
在使用的时候可以用控件去获取屏幕的高度和宽度
<view :style="{ height: wrapperHeight + 'px' ,width:width+'px'}" class="text-area">
在布局的方面应该选择flex弹性布局
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex-flow: column wrap;
}
.box-bottom-style {
padding-left: 5px;
padding-right: 5px;
width: 98%;
height: 50px;
background: #EEEEEE;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
font-size: 14px;
position: fixed;
left: 0;
right: 0;
bottom: 0;
}
向上面这种我可以把这个下面控件固定在屏幕的下方