Ionic 3 ion-textarea如何自动聚焦并弹出键盘
2018-04-16 本文已影响0人
风语菡
步骤如下:
1、html 直接引入ion-textarea,不需要什么特殊处理
2、js中 通过ElementRef 获取textarea元素
import { Keyboard } from '@ionic-native/keyboard';
import { ElementRef } from '@angular/core';
//键盘弹起,tabbar隐藏
keyboardUp() {
this.displayTab(false);
this.showFooter = true;
let el = this.elRef.nativeElement.querySelector('textarea');
setTimeout(() => {
el.focus();
this.keyboard.show(); //for android
}, 500); //至少 150 ms
}
说明:
1. keyboard 需要依赖注入,为了在android中掉起键盘
2. 延时是必须的,网上说至少150ms,我的项目中得设500ms,在iOS上才没有异常;
3、在config.xml中配置 使在iOS能正常掉起键盘
<preference name="KeyboardDisplayRequiresUserAction" value="false" />
通过以上三步,就能使ion-textarea 自动聚焦和弹起键盘了
参考:https://stackoverflow.com/questions/39612653/set-focus-on-an-input-with-ionic-2/42555014