laravel+vue多對多關聯表進行點贊關注等功能

• 難以掩飾此刻的心情，通過一天的奮戰終於搞懂laravel多對多關聯的方法以及如何在vue組件上實現點贊與關注等功能（這裏只作點贊，關注大同小異）。

首先配置laravel與vue，我另一篇文章又說道

1：先配置表結構 ，三張表分別爲：文章表posts 用戶表user 點贊表zans
（點贊表用於關聯文章與用戶,能夠叫作user_posts,這樣能夠少配置底層，這裏用zans清晰一點）

而後laravel命令行artisan命令生成表

2：配置路由

路由分爲兩個 第一個路由用於進入頁面VUE使用mounted自動獲取讚的個數和讚的狀態（贊或取消贊）
第二個路由用於VUE直接請求改變讚的狀態

3：生成控制器與MODULE文件 這裏我就不演示了
可是發幾點注意的地方
（1）

定義模型以後必定要定義fillable否則你會掉進坑裏- - 它的做用是定義這個表能夠注入哪些數據
他還有個相反的屬性 這裏用不到

（2）MOULE名字是單數 數據表名字是複數 別搞錯

4.下面第四部 開始個人表演

(1). 定義最初始的關聯關係 user（用戶）與post（文章）的關聯關係，

第一個參數是當前user模型對象對應的post模型對象的類名，
 第二個參數是兩者之間關聯表的名字:zans，不要忘記加時間戳

(2). 藉助第一步定義好的關聯關係 調用最核心的toggle方法，即若是存在數據刪除 若是不存在就建立。而且傳入參數post_id。就能夠在操做後於關聯表zans中自動生成id,user_id,post_id等數據。

這個關係定義完成以後 咱們就能夠去控制其中完成點贊動做的代碼

控制器定義完畢 去視圖層傳遞數值與激活VUE組件

視圖層定義完成 去Vue組件中進行最後訪問路由接口渲染贊

雙向綁定 實時渲染贊

定義props接收view中傳遞的post_id值

請求接口 傳遞參數 獲取數據

實現點贊功能

.]

(3).
如何保證點贊刷新不會返回到以前的狀態 就要在模型中定義另外一個方法去判斷zans關聯表中是否存在數據 來實現

繼續調用user_post關聯方法 查詢post_id是否存在於關聯表中 開頭的！！號是會讓該語句返回一個布爾值 從而進行判斷

控制器返回true與false供前端判斷

前端利用mounted生命週期方法進入頁面即請求接口傳遞數據去獲取布爾值
判斷關聯表中是否存在數據來渲染贊

刷新後依然不變 已經成功

5.
附上數據庫截圖
posts:

users:

zans

很開心 很開心 繼續努力