Iview的日期選擇器在指定的時間范圍選擇,其余禁止


一個組件傳過來的時間值,如2019,在時間選擇器中只能選擇這一年的時間,其余禁止選擇。

1、

<!-- 時間選擇器 -->
          <Row class="_time">
            <Col span="12">
            <DatePicker type="daterange"
                        transfer
                        :options="forbidDate"
                        :clearable="false"
                        placement="bottom-end"
                        placeholder="時間選擇"
                        style="width: 200px"
                        @on-change="selectDate"
                        v-model="dataVal"></DatePicker>
            </Col>
          </Row>

2、在data中定義傳過來的值,根據情況定義的值

let route = this.$route.query.time

3、在data中寫:options="forbidDate" 的禁止范圍,  用Iview中的disabledDate

 //允許在指定的年份選擇
      forbidDate: {
        disabledDate (date) {
      //獲取當前的年份 const disabledDay
= date.getFullYear(); return (disabledDay < route || disabledDay > route); } }

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM