文章/答案/技术大牛

发布

问Ionic3输入不可选
EN

Stack Overflow用户

提问于 2019-05-26 01:06:08

回答 1查看 294关注 0票数 3

离子角3.9.2

我有一个登录页面，如下所示，当用户未登录时，该页面将在启动时加载。问题是，用户名/电子邮件和密码字段都不能被选中，直到完成以下任一操作：-打开侧菜单，然后关闭它-导航到另一个选项卡，导航回登录-经常在很长一段时间(最多30秒)点击输入字段。

<ion-header title="login">
    <ion-navbar>
        <button ion-button menuToggle>
            <ion-icon name="menu"></ion-icon>
        </button>
        <ion-title>{{"loginPage.title"|translate}}</ion-title>
        <ion-buttons end>
        </ion-buttons>
    </ion-navbar>
</ion-header>
<ion-content padding>
    <form #loginForm="ngForm" novalidate>
        <ion-list no-lines>
            <ion-item>
                <ion-label floating color="primary">{{"loginPage.username"|translate}}</ion-label>
                <ion-input [(ngModel)]="login.username" name="username" type="email" #username="ngModel" spellcheck="false" autocapitalize="off"
                 required>
                </ion-input>
            </ion-item>
            <p ion-text [hidden]="username.valid || submitted == false" color="danger" padding-left>{{"loginPage.usernameRequired"|translate}}
            </p>

            <ion-item>
                <ion-label floating color="primary">{{"loginPage.password"|translate}}</ion-label>
                <ion-input [(ngModel)]="login.password" name="password" type="password" #password="ngModel" required>
                </ion-input>
            </ion-item>
            <p ion-text [hidden]="password.valid || submitted == false" color="danger" padding-left>
                {{"loginPage.passRequired"|translate}}
            </p>
        </ion-list>
        <button ion-button (click)="onLogin(loginForm)" type="submit" block>{{ "loginPage.login" | translate }}</button>
    </form>
    <div></div>
    <div padding>
        <a class="item" href="#" (click)="onSignup()">{{ "loginPage.signup" | translate }}</a>
    </div>
    <div padding>
        <a class="item" href="#" (click)="onForgotPassword()">{{ "loginPage.forgotPassword" | translate }}</a>
    </div>
    <div padding>
        <a class="item" href="#" (click)="onVerify()">{{ "loginPage.verification" | translate }}</a>
    </div>
</ion-content>

关于如何解决这个问题有什么线索吗？因为我在谷歌和离子论坛上看了一个多小时，找不到任何解决问题的方法。

编辑：

我发现了一个通过从元素中移除类输入盖来工作的小黑客。但这感觉很脏..。

let elements = document.querySelectorAll('.input-cover');
for(let i in elements)
{
  if(elements[i].classList)
  elements[i].classList.remove('input-cover');
}

ionic3

ionic-framework

input

回答 1

Stack Overflow用户

发布于 2020-12-30 19:40:47

在您的app.module.ts上，将此代码放入imports标记：

IonicModule.forRoot(MyApp, {
        platforms: {
            android: {
                activator: 'none'
            }
        },
        scrollAssist: false, autoFocusAssist: false
    })

票数 3

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/56309902

复制

相似问题

问Ionic3输入不可选
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Ionic3输入不可选EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Ionic3输入不可选
EN