uniapp: 微信小程序editor，IOS不能正常页面上推问题

<template>
<view>
<view class="container" :style="{ height: editorHeight + ‘px‘ }">
<editor
id="editor"
class="ql-container"
placeholder="请输入内容"
@ready="onEditorReady"
>
</editor>
</view>
<view
class="toolbar"
:style="{ bottom: isIOS ? keyboardHeight + ‘px‘ : ‘0‘ }"
>
测试Bottom
</view>
</view>
</template>
<script>
export default {
data() {
return {
keyboardHeight: 0,
editorHeight: 0,
isIOS: 0,
};
},
onLoad() {
let self = this;
const toolbarHeight = 50;
const { windowHeight, platform } = uni.getSystemInfoSync();
self.isIOS = platform === "ios";
self.editorHeight = windowHeight - toolbarHeight;
uni.onKeyboardHeightChange((res) => {
if (res.height === self.keyboardHeight) return;
self.keyboardHeight = res.height;
self.editorHeight = windowHeight - toolbarHeight - res.height
});
},
methods: {
onEditorReady() {
const that = this;
uni.createSelectorQuery()
.select("#editor")
.context(function (res) {
that.editorCtx = res.context;
})
.exec();
},
},
};
</script>
<style scoped>
.container {
position: absolute;
top: 0;
left: 0;
width: 100%;
}
.ql-container {
box-sizing: border-box;
width: 100%;
height: 100%;
font-size: 16px;
line-height: 1.5;
overflow: auto;
padding: 10px 10px 20px 10px;
border: 1px solid #ececec;
}
.ql-active {
color: #22c704;
}
.iconfont {
display: inline-block;
width: 30px;
height: 30px;
cursor: pointer;
font-size: 20px;
}
.toolbar {
box-sizing: border-box;
padding: 0 10px;
height: 50px;
width: 100%;
position: fixed;
left: 0;
right: 100%;
bottom: 0;
display: flex;
align-items: center;
justify-content: space-between;
border: 1px solid #ececec;
border-left: none;
border-right: none;
}
</style>