10.vue.jsとfirebaseでランキングつき連打ゲーム:index.html
差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン前のリビジョン次のリビジョン | 前のリビジョン | ||
10.vue.jsとfirebaseでランキングつき連打ゲーム:index.html [2018/12/28] – [FirebaseのRTDBのobjectをarrayに変換する] adash333 | 10.vue.jsとfirebaseでランキングつき連打ゲーム:index.html [2018/12/31] (現在) – [0.用意するもの(開発環境)] adash333 | ||
---|---|---|---|
行 39: | 行 39: | ||
< | < | ||
CodeSandbox | CodeSandbox | ||
- | Firebase | + | Firebase |
Vue 2.5.2 | Vue 2.5.2 | ||
Vuetify | Vuetify | ||
行 346: | 行 346: | ||
今回のコードで、一番難しいところ。 | 今回のコードで、一番難しいところ。 | ||
ここは、https:// | ここは、https:// | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
< | < | ||
行 373: | 行 379: | ||
</ | </ | ||
+ | |||
+ | 以下のコードでもよい? | ||
+ | https:// | ||
+ | |||
+ | < | ||
+ | < | ||
+ | <ul v-for=" | ||
+ | < | ||
+ | <button type=" | ||
+ | </ul> | ||
+ | </ | ||
+ | |||
+ | < | ||
+ | |||
+ | created: function() { | ||
+ | this.database = firebase.database(); | ||
+ | this.uid = firebase.auth().currentUser.uid; | ||
+ | this.todosRef = this.database.ref(" | ||
+ | |||
+ | var _this = this; | ||
+ | // データに変更があると実行されるfunction | ||
+ | this.todosRef.on(" | ||
+ | this.todos = snapshot.val(); | ||
+ | }); | ||
+ | }, | ||
+ | | ||
+ | </ | ||
+ | |||
+ | |||
==== FirebaseのRTDBのobjectをarrayに変換する ==== | ==== FirebaseのRTDBのobjectをarrayに変換する ==== | ||
行 414: | 行 449: | ||
これを、listという配列arrayに変換する。 | これを、listという配列arrayに変換する。 | ||
+ | <wrap hi> | ||
+ | (間違っていたらすみません、、、) | ||
https:// | https:// | ||
行 432: | 行 468: | ||
</ | </ | ||
- | ==== foreach文 ==== | + | ==== forEach文 ==== |
行 438: | 行 474: | ||
【JavaScript入門】forEach文の使い方と配列の繰り返し処理まとめ! | 【JavaScript入門】forEach文の使い方と配列の繰り返し処理まとめ! | ||
2016年 by マサト | 2016年 by マサト | ||
+ | |||
+ | ==== forEach文のコールバック関数 ==== | ||
+ | |||
+ | < | ||
+ | array.forEach( function( value, index, array ) { | ||
+ | |||
+ | // 繰り返し処理を書く | ||
+ | |||
+ | }); | ||
+ | </ | ||
+ | |||
+ | value:配列データの値 | ||
+ | index:配列のインデックス番号 | ||
+ | array:現在処理している配列 | ||
+ | |||
+ | https:// | ||
+ | @nantekkotai | ||
+ | 2014年02月21日に更新 | ||
+ | JSのObjectをforEachで処理する方法 | ||
+ | |||
+ | https:// | ||
+ | 2016-06-21 | ||
+ | Javascript 連想配列(オブジェクト)をforEachでループさせたい。 | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
10.vue.jsとfirebaseでランキングつき連打ゲーム/index.html.1546002330.txt.gz · 最終更新: 2018/12/28 by adash333