youzan / vant

A lightweight, customizable Vue UI library for mobile web apps.
https://vant.pro/vant/
MIT License
23.33k stars 9.49k forks source link

[Feature Request] field组件搭配picker等弹出层使用时的问题 #13207

Open yuhengshen opened 2 hours ago

yuhengshen commented 2 hours ago

这个功能解决了什么问题?

场景

使用field搭配弹出层时,此时一般field为readonly状态,此时我想要给field增加clearable不生效。

方案

  1. 不使用readonly,额外通过ref操作dom的方式给input加inputmode属性,此时clearable可以生效,但是移动端会有额外的光标显示出来,不够好。(另外希望能暴露inputmode这个原生属性在field上) Screenshot_2024-11-15-10-06-28-456_com microsoft
  2. 希望在readonly状态下,clearable默认为false,但可以通过prop修改为true

你期望的 API 是什么样子的?

### Tasks
yuhengshen commented 2 hours ago

希望能实现一下两种情况

<van-field inputmode="none" />
<van-field readoly clearable />
inottn commented 2 hours ago

在列举的这个场景下,不使用 Field 会不会更好一些,或者你可以使用 input slot 自定义相关的属性和事件。

yuhengshen commented 2 hours ago

好的,但是我希望能增加inputmode属性,这个应该是可以的吧。

yuhengshen commented 2 hours ago

在列举的这个场景下,不使用 Field 会不会更好一些,或者你可以使用 input slot 自定义相关的属性和事件。

因为这里是要搭配form组件进行处理的,所以是需要用到field与form进行交互

inottn commented 1 hour ago

可以尝试使用 input slot 来解决这个问题,因为 type prop 在组件内部和 inputmode 有一定关联。在这种情况下,我不太倾向于将这个属性暴露给用户。

yuhengshen commented 1 hour ago

我看了代码,里面确实有个mapInputType,但是我认为应该优先使用用户的inputmode,mapInputType应该作为备选

yuhengshen commented 1 hour ago

用户应该有选择键盘弹出的主动权