1. 程式人生 > >vue專案中實現新增收藏的功能,以及利用vue-resource傳送請求

vue專案中實現新增收藏的功能,以及利用vue-resource傳送請求

1.新增收藏功能

    建立一張表,儲存歌手id,使用者id,利用外來鍵將歌手錶與使用者表關聯起來。如果新增收藏之後,為該使用者新增一條資料,取消收藏後,將該條資料刪除。

    當用戶登入之後才能顯示歌手列表中該使用者已經收藏過的歌手,然後將這些收藏的資訊儲存在"我的收藏"中。

    同時要考慮,歌手列表在使用者未登入之前,是為收藏狀態,當用戶登入成功之後要進行判斷,將已經收藏的歌手資訊改變未已收藏狀態;在判斷狀態時,利用自定義屬性data-show,儲存當前已收藏歌手的id,來改變其顯示狀態。在獲取資料時,利用資料的拼接,獲取該使用者下的所有已收藏的歌手資訊。

2.利用vue-resource想伺服器端傳送請求

   get請求:

       this.$http.get("url",{params:{"引數1":"值","引數2":"值",.......}).then(res=>{

            res.data為接收到的資料

      })

   post請求:

       this.$http.post("url",{"引數1":"值","引數2":"值",......},emulateJSON:true).then(res=>{

            res.data為接收到的資料 

      })

   post請求說明:

       使用post方式提交資料時,必須新增emulateJSON:true。如果web伺服器無法處理編碼為application/json的請求,你可以啟用emulateJSON選項。啟用該選項後,請求會以application/x-www-form-urlencoded作為MIME type,就像普通的HTML表單一樣。