一、代码:
(1)控件
1 <span class="filterBlock"> 2 售票时间: 3 <DatePicker v-model="saleDate" 4 format="yyyy/MM/dd" 5 type="daterange" 6 placement="bottom-end" 7 placeholder="请选择" 8 class="filter" 9 :value="saleDate"></DatePicker> 10 </span>
(2)默认值
1 data() { 2 return { 3 saleDate: '', 4 }; 5 }
(3)默认日期取得
1 mounted() { 2 const myDate = new Date(); 3 const year = myDate.getFullYear(); // 获取当前年份 4 const month = myDate.getMonth() + 1; // 获取当前月份(0-11,0代表1月所以要加1); 5 const day = myDate.getDate(); // 获取当前日(1-31) 6 // 日期格式:2019/07/29 - 2019/07/29 7 this.saleDate = `${year}/${month}/${day} - ${year}/${month}/${day}`; 8 },
二、总结:
绑定属性value,给value的值就是显示在日期框中的值
注意:你拼接的当前日期格式要和控件的日期格式一模一样,否则不显示
三、结果显示:
四、超简单方法:
new Date()得出的是中国标准时间,但是iview可以自动转换成要显示的格式状态
1 //调用方法 2 mounted() { 3 this.getDates(); 4 },
1 //写方法 2 methods: { 3 getDates() { 4 const now = new Date(); 5 const nowdate = [now, now]; 6 this.saleDate = nowdate; 7 }, 8 }