alisadream

解决办法:弹出键盘时,隐藏按钮

componentDidMount:
   // 修复键盘弹起导致的页面fixed定位元素布局错乱
    if (device === \'ios\') {
      window.addEventListener(\'focusin\', this.focusin);
      window.addEventListener(\'focusout\', this.focusout);
    } else {
      const clientHeight = document.documentElement.clientHeight || document.body.clientHeight;
      this.setState({ clientHeight });
      window.addEventListener(\'resize\', this.resize);
    }
// 移除监听
  componentWillUnmount() {
    window.removeEventListener(\'resize\', this.resize); 
    window.removeEventListener(\'focusin\', this.focusin);
    window.removeEventListener(\'focusout\', this.focusout);
  }

  focusin = () => {
    this.setState({ showSubmit: false });
  }

  focusout = () => {
    this.setState({ showSubmit: true });
  }

  resize = () => {
    const clientHeightN = document.documentElement.clientHeight || document.body.clientHeight;
    const { clientHeight } = this.state;
    if (clientHeight > clientHeightN) { // 键盘弹出
      this.setState({ showSubmit: false });
    } else { // 键盘收起
      this.setState({ showSubmit: true });
    }
  }

 

分类:

技术点:

相关文章: