From 3dd65b97308f7e2d4beaad597bfef99bdfd093fc Mon Sep 17 00:00:00 2001 From: DCloud_LXH <283700113@qq.com> Date: Mon, 9 Jan 2023 17:03:56 +0800 Subject: [PATCH] feat: input -> inputmode --- docs/component/input.md | 13 +++++++++++++ docs/component/navigator.md | 1 + docs/component/rich-text.md | 2 +- 3 files changed, 15 insertions(+), 1 deletion(-) diff --git a/docs/component/input.md b/docs/component/input.md index edea17ec5..5a7b64c84 100644 --- a/docs/component/input.md +++ b/docs/component/input.md @@ -36,6 +36,7 @@ |random-number|Boolean|false|当 type 为 number, digit, idcard 数字键盘是否随机排列|支付宝小程序 1.9.0+| |controlled|Boolean|false|是否为受控组件。为 true 时,value 内容会完全受 setData 控制|支付宝小程序 1.9.0+| |always-system|Boolean|false|是否强制使用系统键盘和 Web-view 创建的 input 元素。为 true 时,confirm-type、confirm-hold 可能失效|支付宝小程序 2.7.3+| +|inputmode|String|"text"|是一个枚举属性,它提供了用户在编辑元素或其内容时可能输入的数据类型的提示。[详情](#inputmode)|H5(3.6.16+)| |@input|EventHandle||当键盘输入时,触发input事件,event.detail = {value}|差异见下方 Tips| |@focus|EventHandle||输入框聚焦时触发,event.detail = { value, height },height 为键盘高度|仅微信小程序、京东小程序、App(2.2.3+) 、QQ小程序支持 height| |@blur|EventHandle||输入框失去焦点时触发,event.detail = {value: value}|快手小程序不支持| @@ -101,6 +102,18 @@ - App平台的vue页面及 H5平台 的弹出键盘使用的是浏览器控制的键盘,在Chrome81+、Safari13.7+之前,键盘右下角文字只能设置完成和搜索,从Chrome81+、Safari13.7+起支持设置发送、下一个。 - App平台涉及聊天的建议使用nvue,一方面因为app-vue控制键盘右下角按键文字为“发送”对webview内核有要求,另一方面聊天记录如使用scroll-view,过长的内容在app-vue上会有性能问题。 +### inputmode 有效值 @inputmode +|值|说明| +|:-|:-| +|none|无虚拟键盘。在应用程序或者站点需要实现自己的键盘输入控件时很有用。| +|text|使用用户本地区域设置的标准文本输入键盘。| +|decimal|小数输入键盘,包含数字和分隔符(通常是“ . ”或者“ , ”),设备可能也可能不显示减号键。| +|numeric|数字输入键盘,所需要的就是 0 到 9 的数字,设备可能也可能不显示减号键。| +|tel|电话输入键盘,包含 0 到 9 的数字、星号(*)和井号(#)键。表单输入里面的电话输入通常应该使用 \ 。| +|search|为搜索输入优化的虚拟键盘,比如,返回键可能被重新标记为“搜索”,也可能还有其他的优化。| +|email|为邮件地址输入优化的虚拟键盘,通常包含"@"符号和其他优化。表单里面的邮件地址输入应该使用 \ 。| +|url|为网址输入优化的虚拟键盘,比如,“/”键会更加明显、历史记录访问等。表单里面的网址输入通常应该使用 \ 。| + #### App平台iOS端软键盘上方横条去除方案 App平台在iOS上,webview中的软键盘弹出时,默认在软键盘上方有一个横条,显示着:上一项、下一项和完成等按钮。如不想显示这个横条,可以配置softinputNavBar: 'none' diff --git a/docs/component/navigator.md b/docs/component/navigator.md index e7f1b3f87..771319bc2 100644 --- a/docs/component/navigator.md +++ b/docs/component/navigator.md @@ -40,6 +40,7 @@ - app-nvue 平台只有纯nvue项目(render为native)才支持 ``。非render为native的情况下,nvue暂不支持navigator组件,请使用API跳转。 - app下退出应用,Android平台可以使用[plus.runtime.quit](https://www.html5plus.org/doc/zh_cn/runtime.html#plus.runtime.quit)。iOS没有退出应用的概念。 - [uLink组件](https://ext.dcloud.net.cn/plugin?id=1182)是navigator组件的增强版,样式上自带下划线,功能上支持打开在线网页、其他App的schema、mailto发邮件、tel打电话。 +- Vue3 项目因 SSR 需要,H5 端会在外层嵌套 a 标签 **示例** [查看示例](https://hellouniapp.dcloud.net.cn/pages/component/navigator/navigator) diff --git a/docs/component/rich-text.md b/docs/component/rich-text.md index 9e52d472b..89b78b835 100644 --- a/docs/component/rich-text.md +++ b/docs/component/rich-text.md @@ -144,7 +144,7 @@ export default { **Tips** - nodes 不推荐使用 String 类型,性能会有所下降。 -- rich-text 组件内屏蔽所有节点的事件。所以如果内容中有链接、图片需要点击,则不能使用rich-text,此时可在[uni-app插件市场](https://ext.dcloud.net.cn/search?q=parse)搜索parse插件使用。app-nvue的rich-text组件支持链接图片点击。 +- rich-text 组件内屏蔽所有节点的事件。所以如果内容中有链接、图片需要点击,则不能使用rich-text,此时可在[uni-app插件市场](https://ext.dcloud.net.cn/search?q=parse)搜索parse插件使用。app-vue的rich-text组件支持链接图片点击。 - attrs 属性不支持 id ,支持 class 。 - name 属性大小写不敏感。 - 如果使用了不受信任的HTML节点,该节点及其所有子节点将会被移除。 -- GitLab