收藏
回答

vant 自定义日期文案 怎么动态的传值进去?

这里面的值 formatter 应该 怎么动态的 传入进去? 有大佬知道吗?

Page({
  data: {
    formatter(day) {
      const month = day.date.getMonth() + 1;
      const date = day.date.getDate();

      if (month === 5) {
        if (date === 1) {
          day.topInfo = '劳动节';
        } else if (date === 4) {
          day.topInfo = '五四青年节';
        } else if (date === 11) {
          day.text = '今天';
        }
      }

      if (day.type === 'start') {
        day.bottomInfo = '入住';
      } else if (day.type === 'end') {
        day.bottomInfo = '离店';
      }

      return day;
    },
  },
});


回答关注问题邀请回答
收藏

4 个回答

  • 胡路
    胡路
    2020-12-09
    改什么底层代码啊。。只需要 任意调用接口的地方 this.setData 方法,把 formatter重新赋值就可以了。。。 this.setData({
          formatter: function (day) { 你要写的bug } )}
    


    2020-12-09
    有用 6
    回复 1
    • 一圈年装饰-梦哲
      一圈年装饰-梦哲
      2023-01-19
      确实有用,几个小时看到这里才解决
      2023-01-19
      回复
  • MRIC
    MRIC
    2021-07-31

    这个问题貌似uniapp里面有大问题 直接用this获取不到 但是获取当前页面栈的data就能拿到了 真的奇葩

    2021-07-31
    有用 1
    回复 2
    • 婷婷
      婷婷
      2022-09-14
      大哥谢谢你
      2022-09-14
      回复
    • 星辰大海
      星辰大海
      2022-12-16
      大佬,为什么我的总是有三个获取不到data,其他的都正常。本想用call apply修改this指向的,但是失败了啊,搞得头大
      2022-12-16
      回复
  • Hall
    Hall
    2020-08-31

    data: {

        formatter:function(day) {

          //此地方注意一下 请求接口格式化数据时,处理请求一次

          return day;

        }

      },

    /**

       * 获取当月的签到数据

       */

      getMonthSignInData(){

        const _this = this

        network.getRequestLoading(config.getMonthSignInData,{year:_this.data.cur_year,month:_this.data.cur_month}, "正在获取签到数据...",

        function (res) {

         _this.setData({

           signInList:res,

           // 签到状态格式化

           formatter: function(day){

            //...数据处理

            if(day.date<=new Date()){

              if (_this.equalOneDay(day.date,new Date())){ 

                day.text = '今天';

              }else{

                if (_this.getDaySignInStatus(day.date)) {

                  //已签到 

                  day.topInfo = '';

                } else if (!_this.getDaySignInStatus(day.date)) {

                  //签到异常

                  day.bottomInfo = '';

                }

              }

            }

            return day

          }

         })

        }, 


    2020-08-31
    有用 1
    回复 1
    • Hall
      Hall
      2020-08-31
      可以参考大体的思路 具体业务逻辑请自己编写
      2020-08-31
      回复
  • xplee
    xplee
    2020-05-23

    这里面的值 formatter 应该 怎么动态的 传入进去?

    说实话,你这句话就算有配图和代码,我还是不明白你在问什么?

    如果你是想问formatter(day)这个函数的执行结果怎么反映到页面上的话。请参考下面的代码。

    以后提问题请尽量说清楚,大家都节省时间。

    另外,你的代码的写法有点奇怪, 为啥将函数formatter(day)直接定义到了 Page.data 下,多读下文档,了解下这个data是做什么用的。

    js:

    Page({
      data: {
        formatStr: null
      },
    
     onLoad: function() {
        let that = this
        let day = xxx
        this.setData({
          formatStr: that.formatter(day)
        })
     },
    
     formatter: function(day) {
       ...
       return day
     }
    })
    

    wxml:

    <view>{{formatStr}}</view>
    
    2020-05-23
    有用
    回复 20
    • zouhuu
      zouhuu
      2020-05-23
      上面代码是vant官方文档的代码
      2020-05-23
      回复
    • zouhuu
      zouhuu
      2020-05-23
      我需要根据从数据库中查询出来的数据来自定义日期的文案:       https://youzan.github.io/vant-weapp/#/calendar
      2020-05-23
      回复
    • xplee
      xplee
      2020-05-23回复zouhuu
      Vant Weapp的文档已经告诉你了,怎么自定义日期范围,你只需要查询数据库,然后设置日期范围即可。formatter是个函数,vant内部调用时已经把参数传递过去了,你只要处理成自己想要的格式即可。不过它这写法挺奇葩的。
      2020-05-23
      回复
    • zouhuu
      zouhuu
      2020-05-23回复xplee
      我不是要自定义日期范围, 我想要自定义文案
      2020-05-23
      回复
    • xplee
      xplee
      2020-05-23
      害,明白你的意思了。先将自定义文案从数据库中获取出来。
      比如它是这样的: ['0501': '自定义文案', '0601': 'XXX', ...]
      然后在formatter里面判断日期和返回的key值是否匹配,匹配的话就用自定义文案。
      2020-05-23
      回复
    查看更多(15)
登录 后发表内容
问题标签