前提・実現したいこと
現在Vue/Nuxt.js
でElement UI
のdatepicker(https://element.eleme.io/#/en-US/component/date-picker#datepicker)を使用しています。
実装中の処理の中で、
①datepickerで選択した値をv-model
でdataに格納
②dataに格納した値をmoment.js
(https://momentjs.com/)を用いて任意の形式に加工
③Vuexを使って加工した値をstoreに保存
④一度他の画面に遷移し、もう一度元の画面に遷移してきた際にmounted内でstoreの値を取得しdataに格納→datepickerに反映
という流れがあるのですが、
一度moment.jsで加工した日付をstoreから読み取り、dataに格納(datepickerに反映)する際に以下のようなエラー(警告?)が発生しています。
おそらく加工した値のまま、datepickerに反映させているためこのような警告が出ている(datepickerにはdataの値が正常に表示されています)のだと思いますが、どなたか対処方法をご存知の方はいられますでしょうか。
アドバイス等いただければ大変ありがたいです。
よろしくお願いいたします。
発生している問題・エラーメッセージ
Deprecation warning: value provided is not in a recognized RFC2822 or ISO format. moment construction falls back to js Date(), which is not reliable across all browsers and versions. Non RFC2822/ISO date formats are discouraged and will be removed in an upcoming major release. Please refer to http://momentjs.com/guides/#/warnings/js-date/ for more info. Arguments: [0] _isAMomentObject: true, _isUTC: false, _useUTC: false, _l: undefined, _i: 2019/06/22, _f: undefined, _strict: undefined, _locale: [object Object] Error at Function.createFromInputFallback //エラー箇所
該当のソースコード
部分的に該当箇所を抜粋しています。
vue
1<section> 2 <el-date-picker v-model="date"></el-date-picker> 3 <button :click="saveDate">日付を保存<button> 4</section> 5<script> 6import moment from "moment"; 7 8export default { 9 data() { 10 return { 11 date: state.date || new Date() //storeにdateがある場合格納、なければnew Date()を格納 12 } 13 }, 14 methods: { 15 saveDate() { 16 console.log(this.date) //Wed Jun 19 2019 15:26:42 GMT+0900 (日本標準時) 17 const date = moment(this.date).format("YYYY/MM/DD"); 18 console.log(date) //2019/06/19 19 20 save(this.$store, date) //this.dateを加工しstoreに保存 21 } 22 } 23} 24</script>
補足情報(FW/ツールのバージョンなど)
"@nuxtjs/axios": "^5.0.0", "element-ui": "^2.6.1", "moment": "^2.24.0", "nuxt": "^2.4.2",
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/06/19 08:09
2019/06/19 08:48
2019/06/19 08:51
2019/06/19 09:06