• 微信小程序textarea层级过高(盖住其他元素)问题的解决办法


    1.首先,textarea为微信小程序原生组件,其层级是最高的,所以页面中的其他组件无论设置 z-index 为多少,都无法盖在原生组件上。

    2.解决方法:

    方法一:可通过官方提供的<cover-view/>标签嵌套view或者button,或者用<cover-image/>标签

    <cover-view>
        提交
    </cover-view>  


    方法二:我用的vant weapp,第一种方法无法嵌套其组件,遂用一下方法

    (1)用view盛放会覆盖的placeholder(注:如果有弹出层,当弹出弹出层时禁用textarea)

    <view class="placeholder" wx:if="{{locationShow}}">{{ location || '请输入事发地点'}}</view>
    <textarea class="myTextarea" value="{{location}}" data-name="location" bindfocus="locationFocus" bindinput="dataInput" bindblur="locationInput"></textarea>

    (2)定义变量

    location:'',
    locationShow:true,

    (3)添加方法

    //地点聚焦
      locationFocus() {
        this.setData({
          locationShow: false
        })
      },
     dataInput(e){
          var name=e.target.dataset.name,obj={};
          obj[name]=e.detail.value;
          this.setData({
            ...obj
          })
        },
      //地点输入
      locationInput() {
        this.setData({
          locationShow: input.length ? false : true
        });
      },
    

      方法三:部分view啥的可通过:z-index:99999 !important;   解决

  • 相关阅读:
    手动安装vue-devtools
    redis随记
    JS时间格式化
    360自动抢票还不够,几行js代码设置无人值守
    HttpWebRequest请求返回非200的时候 HttpWebResponse怎么接受返回错误提示
    android发编译
    asprise-ocr-api-sample 高价收破解版64 32位
    (16)集合操作
    (15)字典操作
    (14)字符串
  • 原文地址:https://www.cnblogs.com/miaSlady/p/12566198.html
Copyright © 2020-2023  润新知