收藏
回答

input组件的placeholder值出现重影,概率复现

问题模块 框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
客户端 小程序 Bug iOS 12.1 iphone 8 6.7.4

初次进入界面,就这个样子,属于页面初始化时的bug


这个bug出现2次以上,且每次都是iphone设备出现,故推断应该是微信app ios版本的bug


由于这个问题是概率复现,且未找到复现规律,用代码片段也没能复现出来,所以就不提供代码片段了~~~~(>_<)~~~~(一个input组件加一个placeholder属性)


<input class="changjiang-input-mobile" disabled="{{mobileNumberInputDisable}}" placeholder-class="class-placeholder" placeholder="请输入您的手机号"
        type="number" bindinput="onInputMobileNumber" />
 
 
<input class="changjiang-input-code" placeholder-class="class-placeholder" placeholder="请输入收到的验证码" type="number" maxlength="6"
        bindinput="onInputSmsCode" />


两张截图是两个不同的手机出现的,一次是今天,另一次是半个月前,且不是同一手机,但都是ios





最后一次编辑于  2018-11-30
回答关注问题邀请回答
收藏

2 个回答

  • Albert Einstein
    Albert Einstein
    2018-11-30

    出现问题时,手机 vConsole 显示的公共库是多少版本呢

    2018-11-30
    赞同
    回复 4
    • 张博 Bill
      张博 Bill
      2018-11-30

      2.4.1

      2018-11-30
      回复
    • Albert Einstein
      Albert Einstein
      2018-11-30回复张博 Bill

      请提供一下您刚才贴出的 wxml 所用到 wxss 样式哈,我们尽量复现一下

      2018-11-30
      回复
    • 张博 Bill
      张博 Bill
      2018-12-03回复Albert Einstein
      <view class="container">
      <view class="changjiang-mobile-area">
            <view style="width:167rpx;" class="country-code" bindtap="tapCountryCode">
              <text class="country-code-text">+{{countryCode}}</text>
              <view class="country-code-icon iconfont iconfont-jiantou-s"></view>
            </view>
            <view style="background:white;opacity:0.57;width:2rpx;height:37rpx;"></view>
            <input class="changjiang-input-mobile" disabled="{{mobileNumberInputDisable}}" placeholder-class="class-placeholder" placeholder="请输入您的手机号"
              type="number" bindinput="onInputMobileNumber" />
          </view>
          <view class="changjiang-code-area">
            <input class="changjiang-input-code" placeholder-class="class-placeholder" placeholder="请输入收到的验证码" type="number" maxlength="6"
              bindinput="onInputSmsCode" />
            <view style="width: 4rpx; height:31rpx; background-color:rgba(255,255,255,0.2);"></view>
            <button wx:if="{{countdownTime>0}}" class="button-code-left" disabled="true">{{countdownTime}}秒后重发</button>
            <button wx:else class="button-get-code" style="color:{{!mobileNumber?disableColor:mainColor}}" bindtap="tapSendSms" disabled="{{!mobileNumber}}">获取验证码</button>
          </view>
      </view>


      2018-12-03
      回复
    • 张博 Bill
      张博 Bill
      2018-12-03回复Albert Einstein
      .container {
        display: flex;
        flex-flow: column;
        align-items:center;
      }
      .changjiang-mobile-area {
        display: flex;
        flex-flow: row;
        width: 627rpx;
        height: 100rpx;
        align-items: center;
        background: rgba(0, 0, 0, 0.47);
      }
      .country-code {
        color: white;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .country-code-text {
      }
      .country-code-icon {
        font-size: 20rpx;
        margin-left: 8rpx;
      }
      .changjiang-input-mobile {
        font-size: 32rpx;
        line-height: 95rpx;
        margin: auto 25rpx;
        color: white;
      }
      .changjiang-code-area {
        display: flex;
        flex-flow: row;
        margin-top: 15rpx;
        width: 627rpx;
        height: 100rpx;
        align-items: center;
        background: rgba(0, 0, 0, 0.47);
      }
      .changjiang-input-code {
        font-size: 32rpx;
        line-height: 95rpx;
        margin: auto 25rpx;
        color: white;
      }
      .button-code-left{
        width: 200rpx;
        height: 62rpx;
        margin-left: 14rpx;
        margin-right: 14rpx;
        color: white !important;
        background: #9D9D9D !important;
        font-size: 30rpx;
        letter-spacing: 1rpx;
        line-height: 62rpx;
        border-radius: 5rpx;
        box-shadow: 0 1rpx 5rpx rgba(0, 0, 0, 0.5);
        flex-shrink: 0;
      }
      .button-get-code {
        width: 226rpx;
        height: 62rpx;
        margin-left: 14rpx;
        margin-right: 14rpx;
        background: rgba(255, 255, 255, 0.94);
        font-size: 30rpx;
        letter-spacing: 1rpx;
        line-height: 62rpx;
        border-radius: 5rpx;
        box-shadow: 0 1rpx 5rpx rgba(0, 0, 0, 0.5);
        flex-shrink: 0;
      }


      2018-12-03
      回复
  • Vagrant
    Vagrant
    02-20

    input的重影的问题是已知问题,后续会修复,这是相关回复:https://developers.weixin.qq.com/blogdetail?action=get_post_info&docid=0008e493d94c6811eed698b4656000&highline=input%E9%87%8D%E5%BD%B1另外建议后续经过搜索后再提问,以提高问题解答的效率

    02-20
    赞同
    回复 1
    • 张博 Bill
      张博 Bill
      02-21

      我提的问题跟他可不一样,对方写的是“出现重影并马上消失”。我这个是手机没碰屏幕,一直是重影的。这应该是两个问题吧?

      02-21
      回复