美文网首页
日期选择器

日期选择器

作者: 琳媚儿 | 来源:发表于2020-08-30 16:03 被阅读0次

年,月份下拉筛选

fields="month"

<picker mode="date" :value="date" fields="month" :start="startDate" :end="endDate" @change="bindDateChange">
                        <view class="uni-input">{{date}}</view>
                    </picker>
    data() {
            const currentDate = this.getDate({
                format: true
            })
            return {    
                date: currentDate,
            }
        },
methosd:{
  bindDateChange(e) {
                console.log("时间", e)
                this.date = e.target.value
            },
            getDate(type) {
                const date = new Date();
                let year = date.getFullYear();
                let month = date.getMonth() + 1;


                if (type === 'start') {
                    year = year - 60;
                } else if (type === 'end') {
                    year = year + 2;
                }
                month = month > 9 ? month : '0' + month;

                return `${year}-${month}`;
              }
    },
computed: {
            startDate() {
                return this.getDate('start');
                //调列表接口,
            },
            endDate() {
                return this.getDate('end');
                //调列表接口,
            }
        },
捕获.PNG

El 日期查询

        <el-date-picker
          v-model="picker_date"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        ></el-date-picker>

绑定数组 v-model="picker_date"

data(){
  return {
        picker_date: [],
  }
},
methods:{
   //获取 列表 显示 房屋列表信息
    apiCommunityRoomGetListByConRenderList() {
      return new Promise(resolve => {
        _api
          .communityConsole_lockDeviceEventLog_getListByCon({
            start_at: this.picker_date[0],
            end_at: this.picker_date[1],
            level: "0,1,5",
            page: this.pagination.page
          })
          .then(res => {
            resolve(true);
          });
      });
    }
}

相关文章

网友评论

      本文标题:日期选择器

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