1.0.8 • Published 6 years ago
zixun_date v1.0.8
定制化日期选择组件,不建议个人下载使用
使用方式
执行npm i zixun_date
在你的vue
项目中
import Vue from 'vue'
import zixunDate from 'zixun_date'
Vue.use(zixunDate)
即可。
模式一(年月日的选择)
this.$zixunDate.show({
type: "", //默认 datePicker
date: "", //初始化时间 //默认初始化今天
endTime:'', //截至时间 //默认 1950-01-01
startTime:'', //开始时间 //默认 2050-01-01
onOk: date => { //点击确定回调
this.date = date;
console.log(date);
},
onCancel:()=>{ //点击取消回调
console.log('点击了取消')
}
});
模式二(指定列表模式的选择)
...
data(){
return {
dataList = ['2018-11-03','2018-11-12','2018-11-13','2018-11-14','2018-11-15','2018-11-16','2018-11-17','2018-11-18']
}
}
//vue API
...
this.$zixunDate.show({
type: "select",
customList: this.dataList,//自定义时间列表 默认[] type Array
index:4, //默认选中数组中的第几个 默认 0 type Number
//date: "", //当前模式下 该API不起作用
// endTime:'2050-9-8', //当前模式下 该API不起作用
// startTime:'1970-06-19', //当前模式下 该API不起作用
onOk: e => { //点击确定回调
this.date2 = e;
},
onCancel: () => { //点击取消回调
},
//滚动到底部回调
scrollBtm:()=>{ //方便滚动到底部之后加载更多的列
//此处直接使用 this.dataList = '新的数组'即可驱动数据模型更改视图渲染
},
//滚动到顶部回调
scrollTop:()=>{
},
});