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

很开心很开心继续努力