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

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

一、spa

<!-- 時間選擇器 -->
          <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>

二、在data中定義傳過來的值,根據狀況定義的值code

let route = this.$route.query.time

三、在data中寫:options="forbidDate" 的禁止範圍,  用Iview中的disabledDateblog

 //容許在指定的年份選擇
      forbidDate: {
        disabledDate (date) {
      //獲取當前的年份 const disabledDay
= date.getFullYear(); return (disabledDay < route || disabledDay > route); } }
相關文章
相關標籤/搜索