如何在反应离子应用程序中将 ios 键盘 return 按钮更改为 next/done？

Question

我正在尝试将我的 ionic React 应用程序中的 return 按钮更改为 next/done 按钮。我将它用于 redux 表单，我完全不知道它是否应该在反应代码中做，或者它是否在 Xcode.[= 中内置的 swift 代码中13=]

如果有人能指引我到正确的地方或 link 有它，那就太好了。

Answer 1

从 Chrome 77+ 和 iOS Safari 13.4+ 开始，您可以使用 enterkeyhint 属性。

此属性在 Ionic 博客的以下 post 中提到过：https://ionicframework.com/blog/keyboard-improvements-for-ionic-apps/

The enterkeyhint attribute allows developers to specify what type of action label or icon should be shown for the “Enter” key. Using enterkeyhint gives the user a preview of what will happen when they tap the “Enter” key. The value that should be specified here depends on the context of what the user is doing. For example, if the user is typing into a search box, developers should ensure that the input has enterkeyhint="search".

根据HTML standard，可用值为：

enter：用户代理应该为操作 'enter' 提供一个提示，通常是插入一个新行。
done：用户代理应为操作 'done' 提供提示，通常意味着没有更多内容可输入，输入法编辑器 (IME) 将关闭。
go：用户代理应该为操作 'go' 提供提示，通常意味着将用户带到他们键入的文本的目标。
next：用户代理应该为操作 'next' 提供提示，通常会将用户带到下一个将接受文本的字段。
previous：用户代理应该为操作 'previous' 提供提示，通常会将用户带到将接受文本的上一个字段。
search：用户代理应该为操作 'search' 提供提示，通常会将用户带到搜索他们输入的文本的结果。
send：用户代理应该为操作 'send' 提供提示，通常将文本传送到其目标。

由于 Stefan Judis

制作的这个惊人的开发表，您可以看到每个选项的外观

这里是一个使用enterkeyhint的例子：

<ion-item>
  <ion-label>Message: </ion-label>
  <ion-input enterkeyhint="send"></ion-input>
</ion-item>

如何在反应离子应用程序中将 ios 键盘 return 按钮更改为 next/done？

How to change the ios keyboard return button to next/done in an react ionic app?

ios

reactjs

redux-form

ionic4

capacitor