美文网首页
微信小程序使用vant踩得坑

微信小程序使用vant踩得坑

作者: 焚心123 | 来源:发表于2022-05-06 19:56 被阅读0次
    1、使用popup弹出层,滑动到底部,页面还没有锁死,还会进行滚动
    • 1、引入vant组件,写上框起来的那个属性


      image.png
    • 2、将page-meta标签放到当前页面的顶部,show1,show3是控制弹出框显示的属性


      image.png
    2、使用日历组件
    • 1、限制日历组件中的天数,超过固定的天数,天数不可选为disable状态

    • 2、在红框中第一个条件判断哪里啥也不能写,否则会影响组件中原来的状态等


      image.png
    • 3、使用日历组件中的默认时间

      • 要是使用vant文档中的default-date没出来,那么直接复制我下面的代码就可以了,有时候就是这么奇怪
      • 格式化的时候为了兼容ios的,时间的格式‘-’要改为‘/’


        image.png
            //格式的转化,为了ios 上获取不到时间戳
            let _start = this.data.nowDay.replace(/[\-]/g,'/');//"2021-10-22 16:15"
            let _end = this.data.nextDay.replace(/[\-]/g,'/');//"2021-10-22 16:15"
            let dataStart = new Date(_start).getTime() 
            let dataEnd = new Date(_end).getTime()
            let defaultDate = [dataStart,dataEnd]
            console.log(defaultDate,dateStart, dateEnd);
    
    image.png
    3、使用vant中的日历组件的min-date,max-date
    • 使用这个区间的注意事项:首先在data中进行声明并且要有值,否则的话,小程序不会进行渲染,页面进行白屏
    • 当接口返回数据的时候,在重新进行赋值就可以了
    • 默认时间就是点开日历组件默认选择的,可以在data中声明为空


      image.png
      image.png
    • 上面是我获取到的接口中的时间的区间


      image.png
    • 这样就完事了,目前遇到的就这些问题

    相关文章

      网友评论

          本文标题:微信小程序使用vant踩得坑

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