收藏
回答

textarea组件真机bug

问题模块 框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
API和组件 小程序 Bug textarea 客户端 7.0.3 2.6.1

问题描述: 页面上写一个textarea组件,再写一个popup弹层作为信息提示,结果发现textarea组件与页面其他组件不在同一个层级上,设置z-index样式为负值也不管用,只有原生wx.showToast()等接口的显示层级才能覆盖住textarea组件填写的内容,其他任何popup等弹层都不能遮住,设置z-index为10亿也没用;

wxml代码如下:

<view class='address-list-item'>
            <textarea class='input-textarea' auto-height='{{true}}' maxlength='50' placeholder='企业地址(这是一个有bug的组件,组件与页面其他组件不在一个zIndex)'></textarea>
        </view>

js代码

//提交表单
    formSubmit: function(e){
        let self = this;
        let formData = e.detail.value;
        console.log(formData);
        let phonecall = formData.phonecall;
        if (phonecall.length>0 && !Method.regCheck(phonecall,/^[0-9]{7,8}$/)){
            Toast({
                mask: true,
                message: '这是一个popup层,不能遮住有bug的textarea组件'
            });
            /*wx.showToast({
                icon:'none',
                mask:true,
                title: '能遮住有bug的textarea组件',
            })*/
            return;
        }
    },

真机截图如下:



最后一次编辑于  03-06  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏投诉关注问题回答

3 个回答

  • Smile
    Smile
    03-06

    popup弹层里面用cover-view组件看看行不

    03-06
    赞同
    回复
  • 娇华
    娇华
    03-06

    textarea是原生组件,原生组件的层级是最高的,所以页面中的其他组件无论设置 z-index 为多少,都无法盖在原生组件上。https://developers.weixin.qq.com/miniprogram/dev/component/native-component.html

    03-06
    赞同
    回复
  • ~奔跑的蜗牛*
    ~奔跑的蜗牛*
    03-06

    cover-view组件也不行啊

    03-06
    赞同
    回复 2
    • Smile
      Smile
      03-07

      我试了可以,在开发者工具不可以,真机上可以

      <textarea style="height: 80px; width: 90%; margin: 0 auto; border: 1px solid #000" placeholder="输入内容"></textarea>

      <button bindtap="handleIsShowPopup" style="margin-top: 20px" type="primary">显示弹出层</button>

      <cover-view bindtap="handleIsShowPopup" style="display: {{show ? 'block' : 'none'}}; width: 100%; height: 100%; position: fixed; background-color: rgba(0, 0, 0, 0.5); left: 0; top: 0;"></cover-view>

      Page({

          data: {

              show: false

          },

          // 显示/隐藏弹出层

          handleIsShowPopup () {

              let show = !this.data.show;

              this.setData({ show });

          }

      });




      03-07
      回复
    • ~奔跑的蜗牛*
      ~奔跑的蜗牛*
      03-07回复Smile

      可以啊,兄dei,谢谢

      03-07
      回复