import firebase from "firebase/app"
import 'firebase/database' // ①
//もしくは上の二行のかわりに
// import firebase from "firebase" でもいいが。。。。
if (!firebase.apps.length) {
firebase.initializeApp({
apiKey: "AIzaSyDR25V6IjIMmOGRky-Gu7IFk-xk6hfzl-I",
authDomain: "axios-ex.firebaseapp.com",
databaseURL: "https://axios-ex.firebaseio.com",
projectId: "axios-ex",
storageBucket: "axios-ex.appspot.com",
messagingSenderId: "835561925001",
appId: "1:835561925001:web:046d92faf19f64a9011958",
measurementId: "G-KLTB6NPMJE"
})
}
export default firebase
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
index.vueは原文のままでOKだったが、データベースの反映がちょっと時間かかる 諦めないことだ
<template>
<div class="page">
<label>
<span>
お名前:
</span>
<input
type="text"
v-model="user.name"
>
</label>
<label>
<span>
email:
</span>
<input
type="text"
v-model="user.email"
>
</label>
<button
type="button"
@click="submit"
>
Submit
</button>
</div>
</template>
<script>
import firebase from '@/plugins/firebase'
export default {
data () {
return {
user: {
name: "",
email: ""
},
}
},
methods: {
submit () {
let Ref = firebase.database().ref()
Ref.push({ name: this.user.name, body: this.user.email })
.then(response => {
console.log(response, this.user)
})
},
},
}
</script>
---------------------------------------------------------------------------
https://qiita.com/magaya0403/items/e292cd250184ea3fe7b0 これもすぐれもん
Vue.js + FirebaseでTodoアプリを作る ただしVueCli3
ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー
https://qiita.com/ririli/items/d0d3a6ae78c1b6e827fc
Authがまともに動いたfirestoreもばっちり ただしnpm install --save firebase
のあとnpm installしないとだめなことあった なお、Bulmaをインストしてないと
うまく表示されないのが恨み store/index.jsのclearTodoは過剰コード
0 件のコメント:
コメントを投稿