ant design vue 日期選擇器隻選擇年份

1

2

3

4

5

6

7

8

9

10

11

12

13

<code>&lt;</code><code>a-form-model</code> <code>:model="form" :label-col="labelCol" :wrapper-col="wrapperCol"&gt;</code>

<code>            </code><code>&lt;</code><code>a-form-model-item</code> <code>label="年度/季度" &gt;</code>

<code>                </code><code>&lt;</code><code>a-date-picker</code>

<code>                </code><code>mode="year"</code>

<code>                </code><code>placeholder="請選擇年份"</code>

<code>                </code><code>format='YYYY'</code>

<code>                </code><code>v-model="form.yearQuarter" </code>

<code>                </code><code>style="width:100%"</code>

<code>                </code><code>:open='yearShowOne' </code>

<code>                </code><code>@openChange="openChangeOne"</code>

<code>                </code><code>@panelChange="panelChangeOne"/&gt;</code>

<code>            </code><code>&lt;/</code><code>a-form-model-item</code><code>&gt;</code>

<code>&lt;/</code><code>a-form-model</code><code>&gt;</code>

　　

年度打開關閉狀态，true為打開，false為關閉

yearShowOne: false

<code>methods: {</code>

<code>     </code><code>// 彈出月曆和關閉月曆的回調</code>

<code>      </code><code>openChangeOne(status) {</code>

<code>            </code><code>if</code> <code>(status){</code>

<code>                </code><code>this</code><code>.yearShowOne =  </code><code>true</code>

<code>            </code><code>}</code>

<code>        </code><code>},</code>

<code>     </code><code>// 得到年份選擇器的值</code>

<code>     </code><code>panelChangeOne(value) {</code>

<code>            </code><code>this</code><code>.form.yearQuarter = value;</code>

<code>            </code><code>this</code><code>.yearShowOne = </code><code>false</code><code>;</code>

<code>        </code><code>}</code>

<code>}</code>

     &lt;a-date-picker

                  mode="year"

                  placeholder="請選擇年份"

                  format='YYYY'

                  v-model="searchForm.year"

                  style="width:100%"

                  :open='yearShowOne'

                  @openChange="openChangeOne"

                  @panelChange="panelChangeOne"/&gt;

                  yearShowOne: false,

                  openChangeOne(status) {

      if (status){

        this.yearShowOne =  true

      }

    },

    // 得到年份選擇器的值

    panelChangeOne(value) {

      let aa = value.toString();

      this.searchForm.year= aa.substring(11,15);

      this.yearShowOne = false;

    }