input输入框获得焦点出现闪动问题
发布于 6 年前 作者 dumin 17158 次浏览 来自 问答

你想反馈一个 Bug 还是 提一个需求?

    反馈一个bug

如果是 Bug:

* Bug 表现是什么?预期表现是什么?

    Bug表现:input组件,当value属性有值时,获得焦点,输入框的内容会出现闪动。

    预期表现:获得焦点,输入框的内容不会出现闪动

* 如何复现?

    在开发者工具中,input组件不会出现上述的Bug;在进行小程序预览时,就会出现该Bug,点击输入框即可复现。

* 提供一个最简复现 Demo

    wxml:

<view class=“container”>

    <view class=“modifyorder”>

        <view class=“form”>

            <view class=“label”>姓名<strong class=“required”>*</strong> <span class=“required”>{{msgname}}</span></view>

            <view class=“input_box”>

            <input type=“text” class=“input” value="{{orderInfo.buyerName}}"bindblur=“validate” data-name=“name” data-inputname=“姓名” data-validator=“required”/>

            </view>

        </view>

        <view class=“form”>

            <view class=“label”>邮箱<strong class=“required”>*</strong> <span class=“required”>{{msgemail}}</span></view>

            <view class=“input_box”>

            <input type=“text” class=“input” value="{{orderInfo.buyerEmail}}" bindblur=“validate” data-name=“email” data-inputname=“邮箱” data-validator=“required,email”/>

            </view>

        </view>

        <view class=“form”>

            <view class=“label”>手机号<strong class=“required”>*</strong> <span class=“required”>{{msgphone}}</span></view>

            <view class=“input_box”>

            <input type=“text” class=“input” value="{{orderInfo.buyerCellPhone}}" bindblur=“validate” data-name=“phone” data-inputname=“手机号” data-validator=“required,phone”/>

            </view>

        </view>

    </view>

</view>

    

    js:

    data: {

        param:null,

        orderInfo:{

        buyerName:‘测试’,

        buyerEmail:[email protected],

        buyerCellPhone:‘1111111111’

        }

    },

望尽快解决该问题!

    

4 回复

别设置百分比,设置为固定值就好了

是不是设置了margin或者padding?

没有解决,感觉可能是input标签本身的问题

提供一个思路,可以把input中的字体样式属性设置为和焦点选中时的字体样式属性一样

这样应该就不会出现闪动

解决了不??

回到顶部