React Native API之—— Keyboard键盘相关

最近在做React Native开发app,需要对键盘进行操作。查阅文档,发现了一个api——Keyboard

Keyboard模块用来控制键盘相关的事件。

说明

Keyboard模块可以监听原生键盘事件以做出相应回应,比如收回键盘。

方法

addListener()

static addListener(eventName, callback)

addListener用于注册一个 JavaScript 函数来监听处理原生键盘通知事件。

eventName有以下几种:

  • keyboardWillShow
  • keyboardDidShow
  • keyboardWillHide
  • keyboardDidHide
  • keyboardWillChangeFrame
  • keyboardDidChangeFrame

项目中用到了两个keyboardDidShowkeyboardDidHide

removeListener()

static removeListener(eventName, callback)

移除某个类型事件的监听函数。

相关代码

import React from 'react'
import {View,Text,Image,Keyboard
} from 'react-native'componentDidMount() {this.keyboardDidShowListener = Keyboard.addListener('keyboardDidShow', this._keyboardDidShow.bind(this));this.keyboardDidHideListener = Keyboard.addListener('keyboardDidHide', this._keyboardDidHide.bind(this));
}componentWillUnmount() {this.keyboardDidShowListener?.remove();this.keyboardDidHideListener?.remove();
}_keyboardDidShow = (e) => {if (Global.isIOS) {this.setState({keyboardHeight: e?.endCoordinates?.height})}
}_keyboardDidHide = (e) => {this.setState({keyboardHeight: 0})
}


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部