質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

date

dateは、date型や日付に関する関数や処理についてのタグです

Cloud Firestore

Cloud Firestore は、自動スケーリングと高性能を実現し、アプリケーション開発を簡素化するように構築された NoSQLドキュメントデータベースです。

受付中

firestoreから取得したtimestamp型のデータをdate型に変換してstoreのstateに保存したい

churisuke
churisuke

総合スコア5

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

date

dateは、date型や日付に関する関数や処理についてのタグです

Cloud Firestore

Cloud Firestore は、自動スケーリングと高性能を実現し、アプリケーション開発を簡素化するように構築された NoSQLドキュメントデータベースです。

1回答

0評価

1クリップ

3497閲覧

投稿2020/06/07 10:45

前提・実現したいこと

  • firestoreから取得したtimestamp型のデータをdate型に変換してstoreのstateに保存したい

発生している問題・エラーメッセージ

  • firestoreから取得したimestamp型のデータをdate型に変換する方法がわからない。
  • fetchCalenders アクションで「timestamp.toDate()」を試したが、下記エラーが発生する
index.js?4360:54 Uncaught (in promise) TypeError: Cannot read property 'toDate' of undefined

該当のソースコード

vue

import Vue from 'vue' import Vuex from 'vuex' import firebase from 'firebase' Vue.use(Vuex) export default new Vuex.Store({ state: { login_user : null, events: [], }, mutations: { setLoginUser (state, user){ state.login_user = user }, deleteLoginUser (state) { state.login_user = null }, ADD_EVENT:(state,event) =>{ state.events.push(event) }, UPDATE_EVENT: (state,{id, title, start, end}) =>{ let index = state.events.findIndex(_event => _event.id == id) state.events[index].title = title state.events[index].start = start state.events[index].end = end } }, actions: { setLoginUser ({ commit }, user){ commit('setLoginUser',user) }, deleteLoginUser ({ commit }){ commit('deleteLoginUser') }, logout (){ firebase.auth().signOut() }, login () { const google_auth_provider = new firebase.auth.GoogleAuthProvider() firebase.auth().signInWithRedirect(google_auth_provider) }, ADD_EVENT({ getters,commit },event){ if (getters.uid) firebase.firestore().collection(`users/${getters.uid}/calenderes`).add(event) commit('ADD_EVENT',event) }, //ここでfirestoreからのデータ取得をしている // firestoreに格納しているdetaは3種類{title:string,start:timestamp,end:timestamp} fetchCalenders ({ getters, commit }){ firebase.firestore().collection(`users/${getters.uid}/calenderes`).get().then(snapshot => { snapshot.forEach(doc => { commit('ADD_EVENT',doc.data().timestamp.toDate()) }) }) } }, getters: { EVENTS: state => state.events, userName: state =>state.login_user ? state.login_user.displayName : '', photoURL: state =>state.login_user ? state.login_user.photoURL : '', uid : state => state.login_user ? state.login_user.uid : null } })

調査したこと

  • firestoreのtimestampメソッドを使えばできそう
  • ただ公式ドキュメントを読んでもどう使って良いのかわからない

補足情報(FW/ツールのバージョンなど)

PS

  • calendarの綴りが間違っていることはこの後修正予定なので、ご容赦ください。

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

Vue.js

Vue.jsは、Webアプリケーションのインターフェースを構築するためのオープンソースJavaScriptフレームワークです。

date

dateは、date型や日付に関する関数や処理についてのタグです

Cloud Firestore

Cloud Firestore は、自動スケーリングと高性能を実現し、アプリケーション開発を簡素化するように構築された NoSQLドキュメントデータベースです。