指尖上的代码
指尖上的代码
  • 发布:2019-08-08 15:12
  • 更新:2019-10-10 13:27
  • 阅读:2388

【报Bug】input不居中的问题

分类:uni-app

这算是一个老生常谈的问题了,类似的问题反反复复,头疼,以前是placeholder不居中的问题,现在是input本身没居中--

我谷歌浏览器的调试发现是你们编译成h5之后的问题,我input是给了宽高的,但是高度没有应用到编译后的input上。

调试发现input的height是100%但是form(uni-input-form)的高度没有。导致input高度不对。我写的样式只应用到了uni-input-wrapper这里- -单位upx rpx都一样

我这是一个老项目,以前好好的我现在二期修改,,,,,这样的问题对你们来说也不算什么难点吧。怎么总是反复.....

还有就是有时候我需要在微信开发者工具调试h5的页面但是你们这个就很怪,input不显示光标就算了,placeholder不消失,type是text不能输入汉字,我用下qq截图placeholder就消失了,不知道是你们问题还是微信的问题。。。或者我写的有问题

图截得很详细了

2019-08-08 15:12 负责人:无 分享
已邀请:

最佳回复

DCloud_UNI_GSQ

DCloud_UNI_GSQ

此问题在HBuilderX 2.2.3及以上版本已修复

uViewUI

uViewUI - 【www.uviewui.com】uView UI,是uniapp生态最优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水

这个问题,是官方没能力解决,请不要怪他们

uViewUI

uViewUI - 【www.uviewui.com】uView UI,是uniapp生态最优秀的UI框架,全面的组件和便捷的工具会让您信手拈来,如鱼得水

你看看hello uniapp在苹果上,里面所有input的光标都是无法垂直居中的就知道了

diedieteng

diedieteng

手动流泪

  • 指尖上的代码 (作者)

    我用这个挺久了,从最初的mui开始到现在结合weex开发app,我准备做完最后一个app,换成react的生态- -

    2019-08-24 15:36

  • diedieteng

    回复 指尖上的代码: 不要设置 input 的 height,我试过了,你试试看, https://ask.dcloud.net.cn/question/62277

    2019-08-28 15:24

  • diedieteng

    回复 指尖上的代码: 对了 我的是H5

    2019-08-28 15:25

1***@qq.com

1***@qq.com

对的 外面包裹一个view 给它设置高度 input别设置 效果会好点

2***@qq.com

2***@qq.com

用padding挤吧

k***@163.com

k***@163.com

input的高度不能超过60upx, 设置min-height也无效。在外面包一层view,然后用绝对定位。

  • DCloud_UNI_GSQ

    哪端?

    2019-09-29 16:24

  • k***@163.com

    回复 DCloud_UNI_GSQ: H5和手机端,小程序没测试

    2019-10-08 10:30

  • DCloud_UNI_GSQ

    回复 k***@163.com: 目前测试未复现问题,你使用的HBuilderX版本多少?手机什么设备和系统?

    2019-10-08 11:16

  • k***@163.com

    回复 DCloud_UNI_GSQ: HX 2.3.3.20190923 ios 12.4.1 微信版本7.0.8

    2019-10-08 17:37

  • k***@163.com

    回复 DCloud_UNI_GSQ: 比如设置input的高度为100, 那么光标始终就顶到头部,只有input高度的一半

    2019-10-08 17:38

  • DCloud_UNI_GSQ

    回复 k***@163.com: 有没有问题截图?为什么提供微信版本?你意思是只在微信浏览器里才有问题吗?

    2019-10-08 17:46

  • k***@163.com

    回复 DCloud_UNI_GSQ: 我现在截图放在下方

    2019-10-10 13:13

  • k***@163.com

    回复 DCloud_UNI_GSQ: 下方截图中

    白色区域我使用 view标签。在标签中设置的uni-input 。 view样式 height:100upx;

    uni-app样式 ;min-height:100upx;height:100upx;padding;0 20upx;

    在谷歌浏览器中正常,但是在微信公众号或者app中就如下图显示

    2019-10-10 13:30

  • DCloud_UNI_GSQ

    回复 k***@163.com: 判断应该是webview的问题,直接写一个html文件里放个input看是否有此问题

    2019-10-10 16:17

k***@163.com

k***@163.com

截图在下面附件中

该问题目前已经被锁定, 无法添加新回复