uniapp纯js手写日历筛选年,月,日,季度,周
首先看页面效果:
父组件使用
// 引入组件
import timeFilter from './components/timeFilter.vue'
export default {
components: {
timeFilter
},
data() {
return {
endTimeText: '', // 开始时间文本
startTimeText: '', // 结束时间文本
startTime: '', // 开始限制时间
endTime: '', // 结束限制时间
frequency: '',// 时间频率
startTimeUpdate: '', // 修改后的开始时间
endTimeUpdate: '', // 修改后的结束时间
}
},
onLoad(options) {
this.nodeId = options.nodeId
},
methods:{
// 获取子组件传过来筛选过的时间
getTimeQuery(value) {
this.startTimeUpdate = value[0]
this.endTimeUpdate = value[1]
},
// 获取开始时间结束时间频率
getIndicatorList() {
let params = {
nodeId: Number(this.nodeId)
}
queryIndicatorList(JSON.stringify((params))).then(res => {
if (res.data) {
this.startTime = res.data.noAuthStartTime
this.endTime = res.data.noAuthEndTime
this.frequency = res.data.frequency
this.endTimeText = res.data.endTime
this.startTimeText = res.data.startTime
} else {
uni.$u.toast(res.msg)
}
})
},
时间子组件
开始时间
{{startTime}}
结束时间
{{endTime}}