2018/10/15

[Vue] 解決使用 bootstrap-datepicker 搭配 Vue 2 取不到值的問題

有些好用的 JavaScript UI plugin 在一般使用下很方便,但是剛好在搭配 Vue.js v2 就出現非預期的問題

在設計輸入日期欄位,用 HTML5 有 date 的輸入型態可以用,但是若是只想取年份跟月份,藉助 datepicker 就很方便

這回採用 bootstrap-datepicker 這個 plugin

問題:


以一般使用方法沒問題,不過用了 v-model 的 data bind 屬性後,雖然在 UI 看起來無異,但是 Vue 就是讀不到值

解決方法:


在 mounted() 去監聽 datepicker 的 changeDate 事件

參考連結:

2018/10/03

[JavaScript] 解決在 IE 11 出現 'Promise' 未經定義的錯誤

又是一個遇到老瀏覽器不支援新東西的問題

自從拔掉 jQuery 的 $.ajax,改採用 axios 處理非同步資料讀取,IE 11 噴出以下訊息



在不想改變現有寫法下,找到解決的方法,直接用 Promise Polyfill。

Lightweight ES6 Promise polyfill

可以直接引用 CDN

<script src="https://cdn.jsdelivr.net/npm/promise-polyfill@8/dist/polyfill.min.js"></script>

或是下載檔案使用

實驗結果,以最快速確認可行性,就是直接引入 CDN,結果成功!還好不用再改寫法~收工,繼續下一題。