2018年12月23日 星期日

【Firebase】基礎的firebase指令整理(連結資料庫、獲取資料、寫入資料、刪除資料)


▌環境建置

▌在尾端加入firebase代碼

<script src="https://www.gstatic.com/firebasejs/5.7.1/firebase.js"></script>
<script src="./js/usefirebase.js"></script>

▌「連接」資料庫

var config = {
 //省略
};
firebase.initializeApp(config);

▌「獲取」資料庫資料

  • 連接資料庫:var 連接資料庫 = firebase.database().ref(“目錄名稱”);
  • 取得資料庫的資料:目錄名稱 .once(“value”, function (snapshot) { var data = snapshot.val() } 他會是一個{key{….},key{…}}的形式
  • for in:可以取出想要的資料放入陣列
var  connectTofirebase = firebase.database().ref("addIgAccount");
addIgAccount.once("value", function (snapshot) {
    var data = snapshot.val()
    igAccountArray = []
    for (item in data) {
        igAccountArray.push(data[item].account)
    }
    console.log(igAccountArray)

})

▌「寫入」資料庫資料

  • 寫入單筆資料:連接資料庫.push(data).then(function(){.....})
//按下按鈕,並且寫入資料
var  connectTofirebase = firebase.database().ref("addIgAccount");
$('#button-describe').click(function () {
    var igInputAccount = $('#submit_input').val();
    if (igInputAccount == '') {
        toastr.info("請輸入帳號");
    } else if ($.inArray(igInputAccount, igAccountArray) == -1) {

        var data = {
            "account": igInputAccount,
            "date": firebase.database.ServerValue.TIMESTAMP
        };
        connectTofirebase.push(data).then(function () {
            toastr.info("訂閱成功");
        }).catch(function (error) {
            toastr.info("請重新嘗試");
        });

    } else {
        toastr.info("已存在該帳號");
    }
})

▌「移除」資料庫資料

  • 移除單筆資料:連接資料庫.child(key).remove().then(function(){...})
  • 注意:要先取得key才可以移除

var  connectTofirebase = firebase.database().ref("addIgAccount");
$(document).ready(function () {
    $('#button-cancel-describe').click(function () {
        var igInputAccount = $('#submit_input').val();
        if (igInputAccount == '') {
            toastr.info("請輸入帳號");
        } else {
            for (item in allAccountData) {
                if (allAccountData[item].account == igInputAccount) {
                    key = item;
                    connectTofirebase.child(key).remove().then(function () {
                        toastr.info("取消訂閱成功");
                    })
                }

            }

        }
    })
});

沒有留言:

張貼留言

【JavaScript】用物件Mapping的方法

If的寫法 我們希望當變數是a時就回傳1,變數是b就回傳2,變數是c就會回傳3,一般寫法就是用if,但是這樣會很冗 ​ // IF style var word if(word == 'a'){ word = 1 } else if...