美文网首页uniapp 采坑
uniapp 头条小程序采坑(后续持续更新)

uniapp 头条小程序采坑(后续持续更新)

作者: 贾慧斌 | 来源:发表于2020-09-01 11:17 被阅读0次

    1. :ref 不支持动态绑定

    核心点: 不要在for 循环中使用:ref

    解决方案1:

    少数需要动态绑定ref元素时,可以将每个元素都单独绑定一个唯一的ref

    解决方案2:

    ①借助vuex存储数据,使用watch监听数据
    ②借用watch监听,数据变化后,主动触发父组件的回调方法

    2. input 和textarea 层级高, 遮挡底部按钮,修改zindex 无效

    核心点:input 和textarea 在小程序里面调用的是原生控件,无法通过修改zindex 。

    解决方案:

    灵活运用scrollview。设置滚动区域的高度,将底部按钮的位置预留出来

    3. 页面滑动有抖动,不能指定区域滑动 android 和ios 滑动的时候卡顿

    强烈推荐mescroll-uni, 绝对定位

    1. 特定区域滑动

    距离顶部50px,距离底部50px 中间内容滚动

        <mescroll-uni
          ref="mescrollRef"
          height="100%"
          top="100"
          bottom="100"
          :down="{ use: false }"
          :up="{ use: false }"
          :safearea="isIpx"
        >
       </mescroll-un>
    

    4. ipx 底部按钮适配

    核心点:① vux 全局设置isIpx 标识 ② 底部按钮通过一个容器组件包装,里面的内容支持slot传入

    相关文章

      网友评论

        本文标题:uniapp 头条小程序采坑(后续持续更新)

        本文链接:https://www.haomeiwen.com/subject/wnwmsktx.html