vue表单项目解决安卓键盘遮挡输入框问题

一、思路

设计动态class，当输入框onfocus状态触发事件激活class，并且滚动到页面底部，当输入框onblur状态关闭class

<style>.center-box-input-position {margin-top: 0px;}</style><div class="center-box":class="{'center-box-input-position':customerMessageState}"></div><script>export default {data () {return {customerMessageState: false,}}methods:{blurCustomerMessage () {let u = navigator.userAgent;if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {this.customerMessageState = false;}},focusCustomerMessage () {let u = navigator.userAgent;if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {this.customerMessageState = true;this.$nextTick(() => {setTimeout(() => {window.scroll({ top: document.body.clientHeight, left: 0, behavior: 'smooth' });}, 50);});}},}